From 20add279d90a974b033aa3ef327882130683d02b Mon Sep 17 00:00:00 2001
From: Samuel Newman <mozzius@protonmail.com>
Date: Wed, 18 Dec 2024 13:42:52 +0000
Subject: [PATCH 1/5] rm subtitle, add admonition

---
 src/view/com/lists/MyLists.tsx          | 33 +++++++++++++++++++------
 src/view/com/lists/ProfileLists.tsx     |  2 +-
 src/view/screens/Lists.tsx              |  3 ---
 src/view/screens/ModerationModlists.tsx |  5 ----
 4 files changed, 27 insertions(+), 16 deletions(-)

diff --git a/src/view/com/lists/MyLists.tsx b/src/view/com/lists/MyLists.tsx
index 17327fd9ae..1dc13a7230 100644
--- a/src/view/com/lists/MyLists.tsx
+++ b/src/view/com/lists/MyLists.tsx
@@ -8,7 +8,7 @@ import {
   ViewStyle,
 } from 'react-native'
 import {AppBskyGraphDefs as GraphDefs} from '@atproto/api'
-import {msg} from '@lingui/macro'
+import {msg, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 
 import {usePalette} from '#/lib/hooks/usePalette'
@@ -19,6 +19,7 @@ import {useModerationOpts} from '#/state/preferences/moderation-opts'
 import {MyListsFilter, useMyListsQuery} from '#/state/queries/my-lists'
 import {EmptyState} from '#/view/com/util/EmptyState'
 import {atoms as a, useTheme} from '#/alf'
+import {Admonition} from '#/components/Admonition'
 import * as ListCard from '#/components/ListCard'
 import {ErrorMessage} from '../util/error/ErrorMessage'
 import {List} from '../util/List'
@@ -84,11 +85,29 @@ export function MyLists({
     ({item, index}: {item: any; index: number}) => {
       if (item === EMPTY) {
         return (
-          <EmptyState
-            icon="list-ul"
-            message={_(msg`You have no lists.`)}
-            testID="listsEmpty"
-          />
+          <View style={[a.gap_4xl, a.px_xl]}>
+            <EmptyState
+              icon="list-ul"
+              message={_(msg`You have no lists yet.`)}
+              testID="listsEmpty"
+            />
+            {filter === 'curate' && (
+              <Admonition type="tip">
+                <Trans>
+                  You can make lists of users, which can be used to drive feeds.
+                  Lists are public and shareable.
+                </Trans>
+              </Admonition>
+            )}
+            {filter === 'mod' && (
+              <Admonition type="tip">
+                <Trans>
+                  You can make lists of users to mute or block in bulk.
+                  Moderation lists are public and shareable.
+                </Trans>
+              </Admonition>
+            )}
+          </View>
         )
       } else if (item === ERROR_ITEM) {
         return (
@@ -118,7 +137,7 @@ export function MyLists({
         </View>
       )
     },
-    [renderItem, t.atoms.border_contrast_low, _, error, onRefresh],
+    [renderItem, t.atoms.border_contrast_low, _, error, onRefresh, filter],
   )
 
   if (inline) {
diff --git a/src/view/com/lists/ProfileLists.tsx b/src/view/com/lists/ProfileLists.tsx
index 2f63fd172b..07b729c8ed 100644
--- a/src/view/com/lists/ProfileLists.tsx
+++ b/src/view/com/lists/ProfileLists.tsx
@@ -136,7 +136,7 @@ export const ProfileLists = React.forwardRef<SectionRef, ProfileListsProps>(
           return (
             <EmptyState
               icon="list-ul"
-              message={_(msg`You have no lists.`)}
+              message={_(msg`No lists yet.`)}
               testID="listsEmpty"
             />
           )
diff --git a/src/view/screens/Lists.tsx b/src/view/screens/Lists.tsx
index 99abf06039..300153966d 100644
--- a/src/view/screens/Lists.tsx
+++ b/src/view/screens/Lists.tsx
@@ -61,9 +61,6 @@ export function ListsScreen({}: Props) {
           <Layout.Header.TitleText>
             <Trans>Lists</Trans>
           </Layout.Header.TitleText>
-          <Layout.Header.SubtitleText>
-            <Trans>Public, shareable lists which can drive feeds.</Trans>
-          </Layout.Header.SubtitleText>
         </Layout.Header.Content>
         <Button
           label={_(msg`New list`)}
diff --git a/src/view/screens/ModerationModlists.tsx b/src/view/screens/ModerationModlists.tsx
index 0ef4d43896..0b5090e3d4 100644
--- a/src/view/screens/ModerationModlists.tsx
+++ b/src/view/screens/ModerationModlists.tsx
@@ -61,11 +61,6 @@ export function ModerationModlistsScreen({}: Props) {
           <Layout.Header.TitleText>
             <Trans>Moderation Lists</Trans>
           </Layout.Header.TitleText>
-          <Layout.Header.SubtitleText>
-            <Trans>
-              Public, shareable lists of users to mute or block in bulk.
-            </Trans>
-          </Layout.Header.SubtitleText>
         </Layout.Header.Content>
         <Button
           label={_(msg`New list`)}

From dac8f11c24f4606981c5bc8331d181d531c7c5a3 Mon Sep 17 00:00:00 2001
From: Samuel Newman <mozzius@protonmail.com>
Date: Wed, 18 Dec 2024 13:52:03 +0000
Subject: [PATCH 2/5] rm top border from empty state

---
 .../StarterPack/ProfileStarterPacks.tsx       |  2 +-
 src/view/com/util/EmptyState.tsx              | 21 ++++++-------------
 2 files changed, 7 insertions(+), 16 deletions(-)

diff --git a/src/components/StarterPack/ProfileStarterPacks.tsx b/src/components/StarterPack/ProfileStarterPacks.tsx
index 5f58a19df3..64307070bf 100644
--- a/src/components/StarterPack/ProfileStarterPacks.tsx
+++ b/src/components/StarterPack/ProfileStarterPacks.tsx
@@ -228,7 +228,7 @@ function Empty() {
         a.justify_between,
         a.gap_lg,
         a.shadow_lg,
-        {marginTop: 2},
+        {marginTop: 1},
       ]}>
       <View style={[a.gap_xs]}>
         <Text
diff --git a/src/view/com/util/EmptyState.tsx b/src/view/com/util/EmptyState.tsx
index 7f16329365..a6352c2fef 100644
--- a/src/view/com/util/EmptyState.tsx
+++ b/src/view/com/util/EmptyState.tsx
@@ -8,7 +8,6 @@ import {
 import {usePalette} from '#/lib/hooks/usePalette'
 import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
 import {UserGroupIcon} from '#/lib/icons'
-import {isWeb} from '#/platform/detection'
 import {Growth_Stroke2_Corner0_Rounded as Growth} from '#/components/icons/Growth'
 import {Text} from './text/Text'
 
@@ -25,16 +24,11 @@ export function EmptyState({
 }) {
   const pal = usePalette('default')
   const {isTabletOrDesktop} = useWebMediaQueries()
-  const iconSize = isTabletOrDesktop ? 80 : 64
+  const iconSize = isTabletOrDesktop ? 64 : 48
   return (
     <View
       testID={testID}
-      style={[
-        styles.container,
-        isWeb && pal.border,
-        isTabletOrDesktop && {paddingRight: 20},
-        style,
-      ]}>
+      style={[isTabletOrDesktop && {paddingRight: 20}, style]}>
       <View
         style={[
           styles.iconContainer,
@@ -61,23 +55,20 @@ export function EmptyState({
 }
 
 const styles = StyleSheet.create({
-  container: {
-    borderTopWidth: isWeb ? 1 : undefined,
-  },
   iconContainer: {
     flexDirection: 'row',
     alignItems: 'center',
     justifyContent: 'center',
-    height: 100,
-    width: 100,
+    height: 80,
+    width: 80,
     marginLeft: 'auto',
     marginRight: 'auto',
     borderRadius: 80,
     marginTop: 30,
   },
   iconContainerBig: {
-    width: 140,
-    height: 140,
+    width: 100,
+    height: 100,
     marginTop: 50,
   },
   text: {

From 3a653237afdbd24cb614a893e50ec22af2b72950 Mon Sep 17 00:00:00 2001
From: Eric Bailey <git@esb.lol>
Date: Wed, 18 Dec 2024 11:48:06 -0600
Subject: [PATCH 3/5] Minimal approach

---
 src/view/com/lists/MyLists.tsx | 51 ++++++++++++++++++++++------------
 1 file changed, 34 insertions(+), 17 deletions(-)

diff --git a/src/view/com/lists/MyLists.tsx b/src/view/com/lists/MyLists.tsx
index 1dc13a7230..796ced0d05 100644
--- a/src/view/com/lists/MyLists.tsx
+++ b/src/view/com/lists/MyLists.tsx
@@ -8,8 +8,7 @@ import {
   ViewStyle,
 } from 'react-native'
 import {AppBskyGraphDefs as GraphDefs} from '@atproto/api'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
+import {Trans} from '@lingui/macro'
 
 import {usePalette} from '#/lib/hooks/usePalette'
 import {cleanError} from '#/lib/strings/errors'
@@ -17,10 +16,11 @@ import {s} from '#/lib/styles'
 import {logger} from '#/logger'
 import {useModerationOpts} from '#/state/preferences/moderation-opts'
 import {MyListsFilter, useMyListsQuery} from '#/state/queries/my-lists'
-import {EmptyState} from '#/view/com/util/EmptyState'
 import {atoms as a, useTheme} from '#/alf'
 import {Admonition} from '#/components/Admonition'
+import {BulletList_Stroke2_Corner0_Rounded as ListIcon} from '#/components/icons/BulletList'
 import * as ListCard from '#/components/ListCard'
+import {Text} from '#/components/Typography'
 import {ErrorMessage} from '../util/error/ErrorMessage'
 import {List} from '../util/List'
 
@@ -43,7 +43,6 @@ export function MyLists({
 }) {
   const pal = usePalette('default')
   const t = useTheme()
-  const {_} = useLingui()
   const moderationOpts = useModerationOpts()
   const [isPTRing, setIsPTRing] = React.useState(false)
   const {data, isFetching, isFetched, isError, error, refetch} =
@@ -85,28 +84,46 @@ export function MyLists({
     ({item, index}: {item: any; index: number}) => {
       if (item === EMPTY) {
         return (
-          <View style={[a.gap_4xl, a.px_xl]}>
-            <EmptyState
-              icon="list-ul"
-              message={_(msg`You have no lists yet.`)}
-              testID="listsEmpty"
-            />
+          <View style={[a.gap_2xl, a.px_xl, a.pt_xl]}>
             {filter === 'curate' && (
-              <Admonition type="tip">
+              <Admonition type="info">
                 <Trans>
-                  You can make lists of users, which can be used to drive feeds.
-                  Lists are public and shareable.
+                  Public, sharable lists which can be used to drive feeds.
                 </Trans>
               </Admonition>
             )}
             {filter === 'mod' && (
-              <Admonition type="tip">
+              <Admonition type="info">
                 <Trans>
-                  You can make lists of users to mute or block in bulk.
-                  Moderation lists are public and shareable.
+                  Public, sharable lists of users to mute or block in bulk.
                 </Trans>
               </Admonition>
             )}
+            <View
+              style={[
+                a.flex_row,
+                a.justify_center,
+                a.align_center,
+                a.gap_xs,
+                {marginLeft: -14},
+              ]}>
+              <View
+                style={[
+                  a.align_center,
+                  a.justify_center,
+                  a.rounded_full,
+                  t.atoms.bg_contrast_25,
+                  {
+                    width: 28,
+                    height: 28,
+                  },
+                ]}>
+                <ListIcon width={16} fill={t.atoms.text_contrast_low.color} />
+              </View>
+              <Text style={[a.text_sm, t.atoms.text_contrast_medium]}>
+                <Trans>You have no lists yet</Trans>
+              </Text>
+            </View>
           </View>
         )
       } else if (item === ERROR_ITEM) {
@@ -137,7 +154,7 @@ export function MyLists({
         </View>
       )
     },
-    [renderItem, t.atoms.border_contrast_low, _, error, onRefresh, filter],
+    [t, renderItem, error, onRefresh, filter],
   )
 
   if (inline) {

From a33fab6be6f15ea1497b3782d9f03065f7fcbaa2 Mon Sep 17 00:00:00 2001
From: Eric Bailey <git@esb.lol>
Date: Wed, 18 Dec 2024 11:49:54 -0600
Subject: [PATCH 4/5] Revert uneeded change

---
 src/view/com/lists/ProfileLists.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/view/com/lists/ProfileLists.tsx b/src/view/com/lists/ProfileLists.tsx
index 07b729c8ed..2f63fd172b 100644
--- a/src/view/com/lists/ProfileLists.tsx
+++ b/src/view/com/lists/ProfileLists.tsx
@@ -136,7 +136,7 @@ export const ProfileLists = React.forwardRef<SectionRef, ProfileListsProps>(
           return (
             <EmptyState
               icon="list-ul"
-              message={_(msg`No lists yet.`)}
+              message={_(msg`You have no lists.`)}
               testID="listsEmpty"
             />
           )

From fc522b4a1700f8603a9000c7abaf71fd8693336b Mon Sep 17 00:00:00 2001
From: Eric Bailey <git@esb.lol>
Date: Wed, 18 Dec 2024 11:54:28 -0600
Subject: [PATCH 5/5] Even more minimal

---
 src/view/com/lists/MyLists.tsx | 65 ++++++++++++++++------------------
 1 file changed, 30 insertions(+), 35 deletions(-)

diff --git a/src/view/com/lists/MyLists.tsx b/src/view/com/lists/MyLists.tsx
index 796ced0d05..deac87dca2 100644
--- a/src/view/com/lists/MyLists.tsx
+++ b/src/view/com/lists/MyLists.tsx
@@ -17,7 +17,6 @@ import {logger} from '#/logger'
 import {useModerationOpts} from '#/state/preferences/moderation-opts'
 import {MyListsFilter, useMyListsQuery} from '#/state/queries/my-lists'
 import {atoms as a, useTheme} from '#/alf'
-import {Admonition} from '#/components/Admonition'
 import {BulletList_Stroke2_Corner0_Rounded as ListIcon} from '#/components/icons/BulletList'
 import * as ListCard from '#/components/ListCard'
 import {Text} from '#/components/Typography'
@@ -84,46 +83,42 @@ export function MyLists({
     ({item, index}: {item: any; index: number}) => {
       if (item === EMPTY) {
         return (
-          <View style={[a.gap_2xl, a.px_xl, a.pt_xl]}>
-            {filter === 'curate' && (
-              <Admonition type="info">
+          <View style={[a.flex_1, a.align_center, a.gap_sm, a.px_xl, a.pt_xl]}>
+            <View
+              style={[
+                a.align_center,
+                a.justify_center,
+                a.rounded_full,
+                t.atoms.bg_contrast_25,
+                {
+                  width: 32,
+                  height: 32,
+                },
+              ]}>
+              <ListIcon size="md" fill={t.atoms.text_contrast_low.color} />
+            </View>
+            <Text
+              style={[
+                a.text_center,
+                a.flex_1,
+                a.text_sm,
+                a.leading_snug,
+                t.atoms.text_contrast_medium,
+                {
+                  maxWidth: 200,
+                },
+              ]}>
+              {filter === 'curate' && (
                 <Trans>
                   Public, sharable lists which can be used to drive feeds.
                 </Trans>
-              </Admonition>
-            )}
-            {filter === 'mod' && (
-              <Admonition type="info">
+              )}
+              {filter === 'mod' && (
                 <Trans>
                   Public, sharable lists of users to mute or block in bulk.
                 </Trans>
-              </Admonition>
-            )}
-            <View
-              style={[
-                a.flex_row,
-                a.justify_center,
-                a.align_center,
-                a.gap_xs,
-                {marginLeft: -14},
-              ]}>
-              <View
-                style={[
-                  a.align_center,
-                  a.justify_center,
-                  a.rounded_full,
-                  t.atoms.bg_contrast_25,
-                  {
-                    width: 28,
-                    height: 28,
-                  },
-                ]}>
-                <ListIcon width={16} fill={t.atoms.text_contrast_low.color} />
-              </View>
-              <Text style={[a.text_sm, t.atoms.text_contrast_medium]}>
-                <Trans>You have no lists yet</Trans>
-              </Text>
-            </View>
+              )}
+            </Text>
           </View>
         )
       } else if (item === ERROR_ITEM) {