hogumathi-app/hogumathi_app/templates/partial/tweets-carousel.html

<script src="{{ url_for('static', filename='tweets-ui.js') }}"></script>
<script>

{% if notes_app_url %}
var notesAppUrl = {{ notes_app_url | tojson }}
{% endif %}


	if (!window['dataset']) {
		window.dataset = {
			items: [],
			update: function (items) {
				dataset.items = dataset.items.concat(items);
			}
		}
	}
</script>
<ul id="tweets" class="tweets w-75 center z-0">

{% for tweet in tweets %}

<li class="tweet w-100 dt">
<script>
	dataset.update([
		{{ tweet | tojson }}
	]);

</script>


	{% if tweet.retweeted_by %}
	<div class="dt-row moon-gray">
		<p class="dtc w-10 tr pa1">RT</p>
		<p class="dtc w-90"><a class="moon-gray" href="{{ tweet.retweeted_by_url }}">{{ tweet.retweeted_by }} Retweeted</a></p>
	</div>
	{% endif %}
	<div class="dt-row">
		{% include "partial/timeline-tweet.html" %}
		
				

		
		
	</div>
	<div class="dt-row">
		<div class="dtc"></div>
		<div class="dtc ">
		
		
		<p class="tweet-actions-box">
		
		<a hx-post="{{ url_for('.post_tweet_retweet', tweet_id=tweet.id) }}">retweet</a>
		|
		<a hx-get="/twitter/data/thread/{{ tweet.conversation_id }}?me={{ me }}" hx-target="#tweets" hx-swap="outerHTML">view author thread</a>
		|
		<a hx-get="/twitter/data/conversation/{{ tweet.conversation_id }}?me={{ me }}" hx-target="#tweets" hx-swap="outerHTML">view full convo</a>
		|
		<a class="tweet-action bookmark" href="#">bookmark</a>
		|
		<a class="tweet-action copy-formatted" href="javascript:copyTweetToClipboard('{{ tweet.id }}')">copy formatted</a>
		{% if notes_app_url %}
		|
		<a class="tweet-action swipe-to-note" href="javascript:swipeTweetToNotesApp('{{ tweet.id }}')">swipe to note</a>
		{% endif %}
		</p>
		</div>
	</div>
	

	</li>

{% endfor %}



{% if query.next_data_url %}

	<li style="height: 50px; vertical-align: middle"
		hx-get="{{ query.next_data_url }}"
		hx-trigger="revealed"
		hx-swap="outerHTML"
		hx-select="ul#tweets > li"
		>
		<center style="height: 100%">

		<span class="js-only">
		Loading more tweets...
		</span>
		
		{% if query.next_page_url %}
		<a href="{{ query.next_page_url }}">
		Go to Next Page
		</a>
		{% endif %}
		
		<script>
			var profileDataEl = document.querySelector('#profile-data');
			
			if (window['dataset'] && profileDataEl) {
				profileDataEl.innerHTML = dataset.items.filter(i => 'public_metrics' in i).map(i => i.public_metrics.like_count).join(', ');
			}


		</script>
		</center>
	</li>

{% endif %}

</ul>