My Approach was also correct but the only problem was we were missing is that resetting the query before the Post navigation links. Here is the updated Answer.
<?php $user_fav = get_user_favorites($user_id);
$paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1;
$args = array(
'posts_per_page' => 4,
'post_type' => array('communityposts','post','video'),
'post__in' => $user_fav,
'post_status' => 'publish',
'suppress_filters' => true,
'paged' => $paged,
'order_by' => 'date',
'order' => 'ASC'
);
$wp_query = new WP_Query( $args );
if( $wp_query->have_posts()):while($wp_query->have_posts()):$wp_query->the_post();
?>
<article class="post-items-latest">
<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<span class="image-wrapper">
<?php
$thumb = get_post_thumbnail_id($post->ID);
$img_url = wp_get_attachment_url( $thumb,'full' ); //get full URL to image (use "large" or "medium" if the images too big)
$image = aq_resize( $img_url, 226, 117,true,true,true); //resize & crop the image
?>
<?php if(!empty($image)): ?>
<img src="<?php echo $image; ?>" alt="<?php the_title(); ?>" width="226" height="117">
<?php else: ?>
<?php if (has_post_thumbnail()): ?>
<?php the_post_thumbnail( 'large'); ?>
<?php endif; ?>
<?php endif; ?>
</span>
<h1><?php the_title(); ?></h1>
</a>
<div class="post-footer">
<span class="user"><i class="fa fa-user"></i> <?php echo get_the_author_link(); ?></span>
<span class="data"><i class="fa fa-clock-o"></i> <?php wp_days_ago_v3(); ?></span>
<span class="likes"><i class="fa fa-eye"></i> <?php echo $meta_values = get_post_meta( get_the_ID(), 'cv_post_views_count', true ); ?> </span>
</div>
</article>
<?php
endwhile;
endif;
?>
<div class="post-nav-container">
<?php previous_posts_link( __('→ Older Posts')); ?>
<?php next_posts_link( __('Newer Posts ← ')); ?>
</div>
<?php wp_reset_query(); ?>