[APP-1403] Profile empty states (#8969)

* update: Empty state component

* update type error fixes

* add empty state icon

* update translations on labels

* update: lint error for empty state

* remove unused prompt

* update type errors

* fix lint errors and update profile followers and profile follows

* updated starterpack

* fix lint errors

* address feedback

* update icons to be a react element

* update icons

* update viewbox for icons

* optimize: icons and update profile lists

* optimize: icons and update profile lists

* lint error fix

* update iconSize from the rebase

src/screens/ProfileList/AboutSection.tsx

@@ -12,6 +12,7 @@ import {type ListRef} from '#/view/com/util/List'
 import {LoadLatestBtn} from '#/view/com/util/load-latest/LoadLatestBtn'
 import {atoms as a, useBreakpoints} from '#/alf'
 import {Button, ButtonIcon, ButtonText} from '#/components/Button'
+import {BulletList_Stroke1_Corner0_Rounded as ListIcon} from '#/components/icons/BulletList'
 import {PersonPlus_Stroke2_Corner0_Rounded as PersonPlusIcon} from '#/components/icons/Person'
 
 interface SectionRef {
@@ -95,7 +96,7 @@ export function AboutSection({
   const renderEmptyState = useCallback(() => {
     return (
       <View style={[a.gap_xl, a.align_center]}>
-        <EmptyState icon="users-slash" message={_(msg`This list is empty.`)} />
+        <EmptyState icon={ListIcon} message={_(msg`This list is empty.`)} />
         {isOwner && (
           <Button
             testID="emptyStateAddUserBtn"
@@ -111,7 +112,7 @@ export function AboutSection({
         )}
       </View>
     )
-  }, [_, onPressAddUser, isOwner])
+  }, [_, isOwner, onPressAddUser])
 
   return (
     <View>

src/screens/ProfileList/FeedSection.tsx

@@ -7,14 +7,17 @@ import {useQueryClient} from '@tanstack/react-query'
 
 import {isNative} from '#/platform/detection'
 import {listenSoftReset} from '#/state/events'
-import {type FeedDescriptor} from '#/state/queries/post-feed'
-import {RQKEY as FEED_RQKEY} from '#/state/queries/post-feed'
+import {
+  type FeedDescriptor,
+  RQKEY as FEED_RQKEY,
+} from '#/state/queries/post-feed'
 import {PostFeed} from '#/view/com/posts/PostFeed'
 import {EmptyState} from '#/view/com/util/EmptyState'
 import {type ListRef} from '#/view/com/util/List'
 import {LoadLatestBtn} from '#/view/com/util/load-latest/LoadLatestBtn'
 import {atoms as a} from '#/alf'
 import {Button, ButtonIcon, ButtonText} from '#/components/Button'
+import {HashtagWide_Stroke1_Corner0_Rounded as HashtagWideIcon} from '#/components/icons/Hashtag'
 import {PersonPlus_Stroke2_Corner0_Rounded as PersonPlusIcon} from '#/components/icons/Person'
 
 interface SectionRef {
@@ -68,7 +71,11 @@ export function FeedSection({
   const renderPostsEmpty = useCallback(() => {
     return (
       <View style={[a.gap_xl, a.align_center]}>
-        <EmptyState icon="hashtag" message={_(msg`This feed is empty.`)} />
+        <EmptyState
+          icon={HashtagWideIcon}
+          iconSize="2xl"
+          message={_(msg`This feed is empty.`)}
+        />
         {isOwner && (
           <Button
             label={_(msg`Start adding people`)}