From 85c986f5b24e6f8a6db661cca84aa5d83dd5c114 Mon Sep 17 00:00:00 2001
From: automated-signal <37887102+automated-signal@users.noreply.github.com>
Date: Tue, 2 Jul 2024 18:09:35 -0500
Subject: [PATCH] Fix Inbox storybook

Co-authored-by: Fedor Indutny <79877362+indutny-signal@users.noreply.github.com>
---
 images/signal-logo.svg          |  2 +-
 stylesheets/_global.scss        |  2 +-
 ts/components/Inbox.stories.tsx | 12 ++++++++++--
 ts/components/Inbox.tsx         |  2 +-
 4 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/images/signal-logo.svg b/images/signal-logo.svg
index 2ba32a87c7..ff0e2a07e0 100644
--- a/images/signal-logo.svg
+++ b/images/signal-logo.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="128" height="128" viewBox="0 0 128 128"><title>logo final final</title><path d="M48.64,1.87l1.44,5.82A57.84,57.84,0,0,0,34,14.34L30.92,9.2A63.76,63.76,0,0,1,48.64,1.87Zm30.72,0L77.92,7.69A57.84,57.84,0,0,1,94,14.34l3.1-5.14A63.76,63.76,0,0,0,79.36,1.87ZM9.2,30.92A63.76,63.76,0,0,0,1.87,48.64l5.82,1.44A57.84,57.84,0,0,1,14.34,34ZM6,64a57.9,57.9,0,0,1,.65-8.69l-5.93-.9a64.23,64.23,0,0,0,0,19.18l5.93-.9A57.9,57.9,0,0,1,6,64Zm91.08,54.8L94,113.66a57.84,57.84,0,0,1-16.06,6.65l1.44,5.82A63.76,63.76,0,0,0,97.08,118.8ZM122,64a57.9,57.9,0,0,1-.65,8.69l5.93.9a64.23,64.23,0,0,0,0-19.18l-5.93.9A57.9,57.9,0,0,1,122,64Zm4.13,15.36-5.82-1.44A57.84,57.84,0,0,1,113.66,94l5.14,3.1A63.76,63.76,0,0,0,126.13,79.36Zm-53.44,42a58.41,58.41,0,0,1-17.38,0l-.9,5.93a64.23,64.23,0,0,0,19.18,0Zm38-22.95A58.21,58.21,0,0,1,98.4,110.69l3.56,4.83A64.1,64.1,0,0,0,115.52,102ZM98.4,17.31A58.21,58.21,0,0,1,110.69,29.6L115.52,26A64.1,64.1,0,0,0,102,12.48ZM17.31,29.6A58.21,58.21,0,0,1,29.6,17.31L26,12.48A64.1,64.1,0,0,0,12.48,26ZM118.8,30.92,113.66,34a57.84,57.84,0,0,1,6.65,16.06l5.82-1.44A63.76,63.76,0,0,0,118.8,30.92ZM55.31,6.65a58.41,58.41,0,0,1,17.38,0l.9-5.93a64.23,64.23,0,0,0-19.18,0ZM20.39,117.11,8,120l2.89-12.39-5.84-1.37L2.16,118.63a6,6,0,0,0,7.21,7.21L21.75,123ZM6.3,100.89l5.84,1.36,2-8.59A57.75,57.75,0,0,1,7.69,77.92L1.87,79.36a63.52,63.52,0,0,0,5.9,15.21Zm28,13-8.59,2,1.36,5.84,6.32-1.47a63.52,63.52,0,0,0,15.21,5.9l1.44-5.82A57.75,57.75,0,0,1,34.34,113.85ZM64,12A52,52,0,0,0,20,91.67L15,113l21.33-5A52,52,0,1,0,64,12Z" fill="#3a76f0"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" width="128" height="128" viewBox="0 0 128 128"><path d="M48.64,1.87l1.44,5.82A57.84,57.84,0,0,0,34,14.34L30.92,9.2A63.76,63.76,0,0,1,48.64,1.87Zm30.72,0L77.92,7.69A57.84,57.84,0,0,1,94,14.34l3.1-5.14A63.76,63.76,0,0,0,79.36,1.87ZM9.2,30.92A63.76,63.76,0,0,0,1.87,48.64l5.82,1.44A57.84,57.84,0,0,1,14.34,34ZM6,64a57.9,57.9,0,0,1,.65-8.69l-5.93-.9a64.23,64.23,0,0,0,0,19.18l5.93-.9A57.9,57.9,0,0,1,6,64Zm91.08,54.8L94,113.66a57.84,57.84,0,0,1-16.06,6.65l1.44,5.82A63.76,63.76,0,0,0,97.08,118.8ZM122,64a57.9,57.9,0,0,1-.65,8.69l5.93.9a64.23,64.23,0,0,0,0-19.18l-5.93.9A57.9,57.9,0,0,1,122,64Zm4.13,15.36-5.82-1.44A57.84,57.84,0,0,1,113.66,94l5.14,3.1A63.76,63.76,0,0,0,126.13,79.36Zm-53.44,42a58.41,58.41,0,0,1-17.38,0l-.9,5.93a64.23,64.23,0,0,0,19.18,0Zm38-22.95A58.21,58.21,0,0,1,98.4,110.69l3.56,4.83A64.1,64.1,0,0,0,115.52,102ZM98.4,17.31A58.21,58.21,0,0,1,110.69,29.6L115.52,26A64.1,64.1,0,0,0,102,12.48ZM17.31,29.6A58.21,58.21,0,0,1,29.6,17.31L26,12.48A64.1,64.1,0,0,0,12.48,26ZM118.8,30.92,113.66,34a57.84,57.84,0,0,1,6.65,16.06l5.82-1.44A63.76,63.76,0,0,0,118.8,30.92ZM55.31,6.65a58.41,58.41,0,0,1,17.38,0l.9-5.93a64.23,64.23,0,0,0-19.18,0ZM20.39,117.11,8,120l2.89-12.39-5.84-1.37L2.16,118.63a6,6,0,0,0,7.21,7.21L21.75,123ZM6.3,100.89l5.84,1.36,2-8.59A57.75,57.75,0,0,1,7.69,77.92L1.87,79.36a63.52,63.52,0,0,0,5.9,15.21Zm28,13-8.59,2,1.36,5.84,6.32-1.47a63.52,63.52,0,0,0,15.21,5.9l1.44-5.82A57.75,57.75,0,0,1,34.34,113.85ZM64,12A52,52,0,0,0,20,91.67L15,113l21.33-5A52,52,0,1,0,64,12Z" fill="#3a76f0"/></svg>
diff --git a/stylesheets/_global.scss b/stylesheets/_global.scss
index d0f5caf391..fa6535f3b7 100644
--- a/stylesheets/_global.scss
+++ b/stylesheets/_global.scss
@@ -292,7 +292,7 @@ $loading-height: 16px;
   justify-content: center;
   user-select: none;
 
-  .container {
+  .dot-container {
     display: flex;
     gap: 7px;
     margin-block: 6px 22px;
diff --git a/ts/components/Inbox.stories.tsx b/ts/components/Inbox.stories.tsx
index b2f93e4dfc..6ecbc01712 100644
--- a/ts/components/Inbox.stories.tsx
+++ b/ts/components/Inbox.stories.tsx
@@ -21,7 +21,10 @@ export default {
     hasInitialLoadCompleted: false,
     isCustomizingPreferredReactions: false,
   },
-} satisfies Meta<PropsType>;
+  argTypes: {
+    daysAgo: { control: { type: 'number' } },
+  },
+} satisfies Meta<PropsType & { daysAgo?: number }>;
 
 // eslint-disable-next-line react/function-component-definition
 const Template: StoryFn<PropsType & { daysAgo?: number }> = ({
@@ -32,7 +35,7 @@ const Template: StoryFn<PropsType & { daysAgo?: number }> = ({
   const [dayOffset, setDayOffset] = useState(0);
 
   useEffect(() => {
-    if (daysAgo === undefined) {
+    if (!daysAgo) {
       setDayOffset(0);
       return noop;
     }
@@ -64,3 +67,8 @@ const Template: StoryFn<PropsType & { daysAgo?: number }> = ({
 };
 
 export const Default = Template.bind({});
+
+export const FourDaysAgo = Template.bind({});
+FourDaysAgo.args = {
+  daysAgo: 4,
+};
diff --git a/ts/components/Inbox.tsx b/ts/components/Inbox.tsx
index 74a6233521..6a79300d0b 100644
--- a/ts/components/Inbox.tsx
+++ b/ts/components/Inbox.tsx
@@ -128,7 +128,7 @@ export function Inbox({
 
         <div className="module-splash-screen__logo module-img--150" />
         {envelopeTimestamp === undefined ? (
-          <div className="container">
+          <div className="dot-container">
             <span className="dot" />
             <span className="dot" />
             <span className="dot" />