main: small twitter updates and preparations

main/styleguide/source/_patterns/molecules/twitter-box.mustache

-<a href="#" class="mb-5 p-4 w-full flex flex-col items-center text-center border border-grey-100 sm:mb-0 hover:no-underline">
-  <div class="flex flex-row sm:flex-col items-center">
-    <img class="rounded-full shadow-sm w-12 h-12 mb-4 sm:mb-2" src="https://randomuser.me/api/portraits/women/56.jpg"
-         alt="user image"/>
-    <div class="flex flex-col sm:flex-col">
-      <h5 class="font-alt text-xl mb-2 sm:text-base">Tomáš Marný</h5>
-      <small class="mb-4 text-turquoise-400">@pirat.tomas.marny</small>
+<a href="#" class="mb-5 p-4 w-full flex flex-col items-center justify-between text-center border border-grey-100 sm:mb-0 hover:no-underline">
+  <div>
+    <div class="flex flex-row sm:flex-col items-center">
+      <img class="rounded-full shadow-sm w-12 h-12 mb-4 sm:mb-2" src="https://randomuser.me/api/portraits/women/56.jpg"
+           alt="user image"/>
+      <div class="flex flex-col sm:flex-col">
+        <h5 class="font-alt text-xl mb-2 sm:text-base">Tomáš Marný</h5>
+        <small class="mb-4 text-turquoise-400">@pirat.tomas.marny</small>
+      </div>
     </div>
+    <p class="text-small sm:text-base leading-6 mb-2">
+      Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
+      nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et
+      justo duo dolores et ea rebum.
+    </p>
   </div>
-  <p class="text-small sm:text-base leading-6 mb-2">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
-    nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et
-    justo duo dolores et ea rebum.</p>
   <i class="ico--twitter text-turquoise-400 text-3xl sm:text-xl"></i>
 </a>

main/templates/main/includes/twitter_widget.html

 <div class="flex flex-wrap justify-center">
   {% for tweet in tweet_list %}
     <div class="w-full flex max-w-sm sm:max-w-xs">
-      <a href="https://twitter.com/{{ tweet.author_username }}" class="mb-5 p-4 w-full flex flex-col items-center text-center border border-grey-100 sm:mb-0 hover:no-underline">
-        <div class="flex flex-row sm:flex-col items-center">
-          <img
-            class="rounded-full shadow-sm w-12 mb-2"
-            src="{{ tweet.author_img_url }}"
-            alt="user image"
-          />
-          <div class="flex flex-col sm:flex-col">
-            <h5 class="font-alt text-xl mb-2 sm:text-base">
-              {{ tweet.author_name }}
-            </h5>
-            <small class="mb-4 text-turquoise-400">
-              {{ tweet.author_username }}
-            </small>
+      <a
+        href="https://twitter.com/{{ tweet.author_username }}"
+        class="mb-5 p-4 w-full flex flex-col items-center justify-between text-center border border-grey-100 sm:mb-0 hover:no-underline"
+      >
+        <div>
+          <div class="flex flex-row sm:flex-col items-center">
+            <img
+              class="rounded-full shadow-sm w-12 mb-2"
+              src="{{ tweet.author_img_url }}"
+              alt="user image"
+            />
+            <div class="flex flex-col sm:flex-col">
+              <h5 class="font-alt text-xl mb-2 sm:text-base">
+                {{ tweet.author_name }}
+              </h5>
+              <small class="mb-4 text-turquoise-400">
+                {{ tweet.author_username }}
+              </small>
+            </div>
           </div>
+          <p class="text-small sm:text-base leading-6 mb-2">
+            {{ tweet.text }}
+          </p>
         </div>
-        <p class="text-small sm:text-base leading-6 mb-2">
-          {{ tweet.text }}
-        </p>
         <i class="ico--twitter text-turquoise-400 text-3xl sm:text-xl"></i>
       </a>
     </div>

twitter_utils/services.py

@@ -49,8 +49,13 @@ class TweetDownloadService:
         tweets_response = self.client.get_users_tweets(
             user_id,
             exclude=["retweets"],
-            expansions=["author_id", "entities.mentions.username"],
+            expansions=[
+                "author_id",
+                "attachments.media_keys",
+                "entities.mentions.username",
+            ],
             max_results=100,
+            media_fields=["url"],  # TODO use this? download need probably
             start_time=timezone.now() - timedelta(days=self.days_back),
             tweet_fields=["author_id", "created_at"],
             user_fields=["name", "username"],
@@ -113,7 +118,7 @@ class TweetDownloadService:
                             author_img_url=user_data.profile_image_url,
                             author_name=user_data.name,
                             author_username=user_data.username,
-                            text=tweet.text,
+                            text=tweet.text.split("https://t.co")[0],
                             twitter_id=str(tweet.id),
                         )
                     )