Standarize on shields (#8204) · veryroundbird.house/witchsky.app@16462b0

+1

assets/icons/shieldCheck_stroke2_corner0_rounded.svg

···

··· 1 + <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="#000" fill-rule="evenodd" d="M12.325 2.054a1 1 0 0 0-.65 0l-8 2.75A1 1 0 0 0 3 5.75v6.162c0 2.807 1.149 4.83 2.813 6.405 1.572 1.488 3.632 2.6 5.555 3.636l.157.085a1 1 0 0 0 .95 0l.157-.085c1.923-1.037 3.983-2.148 5.556-3.636C19.85 16.742 21 14.719 21 11.912V5.75a1 1 0 0 0-.675-.946l-8-2.75ZM5 11.912V6.464l7-2.407 7 2.407v5.448c0 2.166-.851 3.687-2.188 4.952-1.276 1.209-2.964 2.158-4.812 3.157-1.848-1-3.536-1.948-4.813-3.157C5.851 15.6 5 14.078 5 11.912Zm10.207-1.205a1 1 0 0 0-1.414-1.414L11 12.086l-.793-.793a1 1 0 0 0-1.414 1.414l1.5 1.5a1 1 0 0 0 1.414 0l3.5-3.5Z" clip-rule="evenodd"/></svg>

+4

src/components/icons/Shield.tsx

··· 3 export const Shield_Stroke2_Corner0_Rounded = createSinglePathSVG({ 4 path: 'M11.675 2.054a1 1 0 0 1 .65 0l8 2.75A1 1 0 0 1 21 5.75v6.162c0 2.807-1.149 4.83-2.813 6.405-1.572 1.488-3.632 2.6-5.555 3.636l-.157.085a1 1 0 0 1-.95 0l-.157-.085c-1.923-1.037-3.983-2.148-5.556-3.636C4.15 16.742 3 14.719 3 11.912V5.75a1 1 0 0 1 .675-.946l8-2.75ZM5 6.464v5.448c0 2.166.851 3.687 2.188 4.952 1.276 1.209 2.964 2.158 4.812 3.157 1.848-1 3.536-1.948 4.813-3.157C18.148 15.6 19 14.078 19 11.912V6.464l-7-2.407-7 2.407Z', 5 })

··· 3 export const Shield_Stroke2_Corner0_Rounded = createSinglePathSVG({ 4 path: 'M11.675 2.054a1 1 0 0 1 .65 0l8 2.75A1 1 0 0 1 21 5.75v6.162c0 2.807-1.149 4.83-2.813 6.405-1.572 1.488-3.632 2.6-5.555 3.636l-.157.085a1 1 0 0 1-.95 0l-.157-.085c-1.923-1.037-3.983-2.148-5.556-3.636C4.15 16.742 3 14.719 3 11.912V5.75a1 1 0 0 1 .675-.946l8-2.75ZM5 6.464v5.448c0 2.166.851 3.687 2.188 4.952 1.276 1.209 2.964 2.158 4.812 3.157 1.848-1 3.536-1.948 4.813-3.157C18.148 15.6 19 14.078 19 11.912V6.464l-7-2.407-7 2.407Z', 5 }) 6 + 7 + export const ShieldCheck_Stroke2_Corner0_Rounded = createSinglePathSVG({ 8 + path: 'M12.325 2.054a1 1 0 0 0-.65 0l-8 2.75A1 1 0 0 0 3 5.75v6.162c0 2.807 1.149 4.83 2.813 6.405 1.572 1.488 3.632 2.6 5.555 3.636l.157.085a1 1 0 0 0 .95 0l.157-.085c1.923-1.037 3.983-2.148 5.556-3.636C19.85 16.742 21 14.719 21 11.912V5.75a1 1 0 0 0-.675-.946l-8-2.75ZM5 11.912V6.464l7-2.407 7 2.407v5.448c0 2.166-.851 3.687-2.188 4.952-1.276 1.209-2.964 2.158-4.812 3.157-1.848-1-3.536-1.948-4.813-3.157C5.851 15.6 5 14.078 5 11.912Zm10.207-1.205a1 1 0 0 0-1.414-1.414L11 12.086l-.793-.793a1 1 0 0 0-1.414 1.414l1.5 1.5a1 1 0 0 0 1.414 0l3.5-3.5Z', 9 + })

+7 -9

src/screens/Profile/Header/ProfileHeaderStandard.tsx

··· 1 import React, {memo, useMemo} from 'react' 2 import {View} from 'react-native' 3 import { 4 - AppBskyActorDefs, 5 moderateProfile, 6 - ModerationOpts, 7 - RichText as RichTextAPI, 8 } from '@atproto/api' 9 import {msg, Trans} from '@lingui/macro' 10 import {useLingui} from '@lingui/react' ··· 13 import {logger} from '#/logger' 14 import {isIOS, isWeb} from '#/platform/detection' 15 import {useProfileShadow} from '#/state/cache/profile-shadow' 16 - import {Shadow} from '#/state/cache/types' 17 import {useModalControls} from '#/state/modals' 18 import { 19 useProfileBlockMutationQueue, ··· 26 import {Button, ButtonIcon, ButtonText} from '#/components/Button' 27 import {useDialogControl} from '#/components/Dialog' 28 import {MessageProfileButton} from '#/components/dms/MessageProfileButton' 29 - import {Check_Stroke2_Corner0_Rounded as Check} from '#/components/icons/Check' 30 import {PlusLarge_Stroke2_Corner0_Rounded as Plus} from '#/components/icons/Plus' 31 import { 32 KnownFollowers, ··· 221 profile.viewer?.following ? onPressUnfollow : onPressFollow 222 } 223 style={[a.rounded_full]}> 224 - <ButtonIcon 225 - position="left" 226 - icon={profile.viewer?.following ? Check : Plus} 227 - /> 228 <ButtonText> 229 {profile.viewer?.following ? ( 230 <Trans>Following</Trans>

··· 1 import React, {memo, useMemo} from 'react' 2 import {View} from 'react-native' 3 import { 4 + type AppBskyActorDefs, 5 moderateProfile, 6 + type ModerationOpts, 7 + type RichText as RichTextAPI, 8 } from '@atproto/api' 9 import {msg, Trans} from '@lingui/macro' 10 import {useLingui} from '@lingui/react' ··· 13 import {logger} from '#/logger' 14 import {isIOS, isWeb} from '#/platform/detection' 15 import {useProfileShadow} from '#/state/cache/profile-shadow' 16 + import {type Shadow} from '#/state/cache/types' 17 import {useModalControls} from '#/state/modals' 18 import { 19 useProfileBlockMutationQueue, ··· 26 import {Button, ButtonIcon, ButtonText} from '#/components/Button' 27 import {useDialogControl} from '#/components/Dialog' 28 import {MessageProfileButton} from '#/components/dms/MessageProfileButton' 29 import {PlusLarge_Stroke2_Corner0_Rounded as Plus} from '#/components/icons/Plus' 30 import { 31 KnownFollowers, ··· 220 profile.viewer?.following ? onPressUnfollow : onPressFollow 221 } 222 style={[a.rounded_full]}> 223 + {!profile.viewer?.following && ( 224 + <ButtonIcon position="left" icon={Plus} /> 225 + )} 226 <ButtonText> 227 {profile.viewer?.following ? ( 228 <Trans>Following</Trans>

+5 -5

src/screens/Settings/AccountSettings.tsx

··· 1 import {msg, Trans} from '@lingui/macro' 2 import {useLingui} from '@lingui/react' 3 - import {NativeStackScreenProps} from '@react-navigation/native-stack' 4 5 - import {CommonNavigatorParams} from '#/lib/routes/types' 6 import {useModalControls} from '#/state/modals' 7 import {useSession} from '#/state/session' 8 import * as SettingsList from '#/screens/Settings/components/SettingsList' ··· 17 import {Freeze_Stroke2_Corner2_Rounded as FreezeIcon} from '#/components/icons/Freeze' 18 import {Lock_Stroke2_Corner2_Rounded as LockIcon} from '#/components/icons/Lock' 19 import {PencilLine_Stroke2_Corner2_Rounded as PencilIcon} from '#/components/icons/Pencil' 20 import {Trash_Stroke2_Corner2_Rounded} from '#/components/icons/Trash' 21 - import {Verified_Stroke2_Corner2_Rounded as VerifiedIcon} from '#/components/icons/Verified' 22 import * as Layout from '#/components/Layout' 23 import {ChangeHandleDialog} from './components/ChangeHandleDialog' 24 import {DeactivateAccountDialog} from './components/DeactivateAccountDialog' ··· 65 {currentAccount.email || <Trans>(no email)</Trans>} 66 </SettingsList.BadgeText> 67 {currentAccount.emailConfirmed && ( 68 - <VerifiedIcon fill={t.palette.primary_500} size="md" /> 69 )} 70 </> 71 )} ··· 83 hoverStyle={[{backgroundColor: t.palette.primary_100}]} 84 contentContainerStyle={[a.rounded_md, a.px_lg]}> 85 <SettingsList.ItemIcon 86 - icon={VerifiedIcon} 87 color={t.palette.primary_500} 88 /> 89 <SettingsList.ItemText

··· 1 import {msg, Trans} from '@lingui/macro' 2 import {useLingui} from '@lingui/react' 3 + import {type NativeStackScreenProps} from '@react-navigation/native-stack' 4 5 + import {type CommonNavigatorParams} from '#/lib/routes/types' 6 import {useModalControls} from '#/state/modals' 7 import {useSession} from '#/state/session' 8 import * as SettingsList from '#/screens/Settings/components/SettingsList' ··· 17 import {Freeze_Stroke2_Corner2_Rounded as FreezeIcon} from '#/components/icons/Freeze' 18 import {Lock_Stroke2_Corner2_Rounded as LockIcon} from '#/components/icons/Lock' 19 import {PencilLine_Stroke2_Corner2_Rounded as PencilIcon} from '#/components/icons/Pencil' 20 + import {ShieldCheck_Stroke2_Corner0_Rounded as ShieldIcon} from '#/components/icons/Shield' 21 import {Trash_Stroke2_Corner2_Rounded} from '#/components/icons/Trash' 22 import * as Layout from '#/components/Layout' 23 import {ChangeHandleDialog} from './components/ChangeHandleDialog' 24 import {DeactivateAccountDialog} from './components/DeactivateAccountDialog' ··· 65 {currentAccount.email || <Trans>(no email)</Trans>} 66 </SettingsList.BadgeText> 67 {currentAccount.emailConfirmed && ( 68 + <ShieldIcon fill={t.palette.primary_500} size="md" /> 69 )} 70 </> 71 )} ··· 83 hoverStyle={[{backgroundColor: t.palette.primary_100}]} 84 contentContainerStyle={[a.rounded_md, a.px_lg]}> 85 <SettingsList.ItemIcon 86 + icon={ShieldIcon} 87 color={t.palette.primary_500} 88 /> 89 <SettingsList.ItemText

+4 -4

src/screens/Settings/PrivacyAndSecuritySettings.tsx

··· 1 import {View} from 'react-native' 2 import {msg, Trans} from '@lingui/macro' 3 import {useLingui} from '@lingui/react' 4 - import {NativeStackScreenProps} from '@react-navigation/native-stack' 5 6 - import {CommonNavigatorParams} from '#/lib/routes/types' 7 import {useAppPasswordsQuery} from '#/state/queries/app-passwords' 8 import {useSession} from '#/state/session' 9 import * as SettingsList from '#/screens/Settings/components/SettingsList' ··· 11 import * as Admonition from '#/components/Admonition' 12 import {EyeSlash_Stroke2_Corner0_Rounded as EyeSlashIcon} from '#/components/icons/EyeSlash' 13 import {Key_Stroke2_Corner2_Rounded as KeyIcon} from '#/components/icons/Key' 14 - import {Verified_Stroke2_Corner2_Rounded as VerifiedIcon} from '#/components/icons/Verified' 15 import * as Layout from '#/components/Layout' 16 import {InlineLinkText} from '#/components/Link' 17 import {Email2FAToggle} from './components/Email2FAToggle' ··· 42 <SettingsList.Container> 43 <SettingsList.Item> 44 <SettingsList.ItemIcon 45 - icon={VerifiedIcon} 46 color={ 47 currentAccount?.emailAuthFactor 48 ? t.palette.primary_500

··· 1 import {View} from 'react-native' 2 import {msg, Trans} from '@lingui/macro' 3 import {useLingui} from '@lingui/react' 4 + import {type NativeStackScreenProps} from '@react-navigation/native-stack' 5 6 + import {type CommonNavigatorParams} from '#/lib/routes/types' 7 import {useAppPasswordsQuery} from '#/state/queries/app-passwords' 8 import {useSession} from '#/state/session' 9 import * as SettingsList from '#/screens/Settings/components/SettingsList' ··· 11 import * as Admonition from '#/components/Admonition' 12 import {EyeSlash_Stroke2_Corner0_Rounded as EyeSlashIcon} from '#/components/icons/EyeSlash' 13 import {Key_Stroke2_Corner2_Rounded as KeyIcon} from '#/components/icons/Key' 14 + import {ShieldCheck_Stroke2_Corner0_Rounded as ShieldIcon} from '#/components/icons/Shield' 15 import * as Layout from '#/components/Layout' 16 import {InlineLinkText} from '#/components/Link' 17 import {Email2FAToggle} from './components/Email2FAToggle' ··· 42 <SettingsList.Container> 43 <SettingsList.Item> 44 <SettingsList.ItemIcon 45 + icon={ShieldIcon} 46 color={ 47 currentAccount?.emailAuthFactor 48 ? t.palette.primary_500

+2 -2

src/view/screens/Storybook/Settings.tsx

··· 14 import {Person_Stroke2_Corner2_Rounded as PersonIcon} from '#/components/icons/Person' 15 import {Pizza_Stroke2_Corner0_Rounded as PizzaIcon} from '#/components/icons/Pizza' 16 import {RaisingHand4Finger_Stroke2_Corner2_Rounded as HandIcon} from '#/components/icons/RaisingHand' 17 - import {Verified_Stroke2_Corner2_Rounded as VerifiedIcon} from '#/components/icons/Verified' 18 import {Window_Stroke2_Corner2_Rounded as WindowIcon} from '#/components/icons/Window' 19 import {Text} from '#/components/Typography' 20 ··· 102 hoverStyle={[{backgroundColor: t.palette.primary_100}]} 103 contentContainerStyle={[a.rounded_md, a.px_lg]}> 104 <SettingsList.ItemIcon 105 - icon={VerifiedIcon} 106 color={t.palette.primary_500} 107 /> 108 <SettingsList.ItemText

··· 14 import {Person_Stroke2_Corner2_Rounded as PersonIcon} from '#/components/icons/Person' 15 import {Pizza_Stroke2_Corner0_Rounded as PizzaIcon} from '#/components/icons/Pizza' 16 import {RaisingHand4Finger_Stroke2_Corner2_Rounded as HandIcon} from '#/components/icons/RaisingHand' 17 + import {ShieldCheck_Stroke2_Corner0_Rounded as ShieldIcon} from '#/components/icons/Shield' 18 import {Window_Stroke2_Corner2_Rounded as WindowIcon} from '#/components/icons/Window' 19 import {Text} from '#/components/Typography' 20 ··· 102 hoverStyle={[{backgroundColor: t.palette.primary_100}]} 103 contentContainerStyle={[a.rounded_md, a.px_lg]}> 104 <SettingsList.ItemIcon 105 + icon={ShieldIcon} 106 color={t.palette.primary_500} 107 /> 108 <SettingsList.ItemText