about summary refs log tree commit diff
path: root/src/view/com/util/UserBanner.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/view/com/util/UserBanner.tsx')
-rw-r--r--src/view/com/util/UserBanner.tsx17
1 files changed, 14 insertions, 3 deletions
diff --git a/src/view/com/util/UserBanner.tsx b/src/view/com/util/UserBanner.tsx
index a5ddfee8a..4d73b853b 100644
--- a/src/view/com/util/UserBanner.tsx
+++ b/src/view/com/util/UserBanner.tsx
@@ -7,7 +7,7 @@ import {msg, Trans} from '@lingui/macro'
 
 import {colors} from 'lib/styles'
 import {useTheme} from 'lib/ThemeContext'
-import {useTheme as useAlfTheme} from '#/alf'
+import {useTheme as useAlfTheme, tokens} from '#/alf'
 import {openCamera, openCropper, openPicker} from '../../../lib/media/picker'
 import {
   usePhotoLibraryPermission,
@@ -26,10 +26,12 @@ import {StreamingLive_Stroke2_Corner0_Rounded as Library} from '#/components/ico
 import {Trash_Stroke2_Corner0_Rounded as Trash} from '#/components/icons/Trash'
 
 export function UserBanner({
+  type,
   banner,
   moderation,
   onSelectNewBanner,
 }: {
+  type?: 'labeler' | 'default'
   banner?: string | null
   moderation?: ModerationUI
   onSelectNewBanner?: (img: RNImage | null) => void
@@ -82,7 +84,10 @@ export function UserBanner({
       <Menu.Root>
         <Menu.Trigger label={_(msg`Edit avatar`)}>
           {({props}) => (
-            <TouchableOpacity {...props} activeOpacity={0.8}>
+            <TouchableOpacity
+              {...props}
+              activeOpacity={0.8}
+              testID="changeBannerBtn">
               {banner ? (
                 <Image
                   testID="userBannerImage"
@@ -167,7 +172,10 @@ export function UserBanner({
   ) : (
     <View
       testID="userBannerFallback"
-      style={[styles.bannerImage, styles.defaultBanner]}
+      style={[
+        styles.bannerImage,
+        type === 'labeler' ? styles.labelerBanner : styles.defaultBanner,
+      ]}
     />
   )
 }
@@ -191,4 +199,7 @@ const styles = StyleSheet.create({
   defaultBanner: {
     backgroundColor: '#0070ff',
   },
+  labelerBanner: {
+    backgroundColor: tokens.color.temp_purple,
+  },
 })