+5 -3

src/screens/Profile/Header/Shell.tsx

··· 22 22 import {isIOS} from '#/platform/detection' 23 23 import {type Shadow} from '#/state/cache/types' 24 24 import {useLightboxControls} from '#/state/lightbox' 25 25 + import {useEnableSquareAvatars} from '#/state/preferences/enable-square-avatars' 25 26 import { 26 27 maybeModifyHighQualityImage, 27 28 useHighQualityImages, ··· 66 67 const playHaptic = useHaptics() 67 68 const liveStatusControl = useDialogControl() 68 69 const highQualityImages = useHighQualityImages() 70 70 + const enableSquareAvatars = useEnableSquareAvatars() 69 71 70 72 const aviRef = useAnimatedRef() 71 73 const bannerRef = useAnimatedRef() ··· 92 94 width: 1000, 93 95 }, 94 96 thumbDimensions: null, 95 95 - type: 'circle-avi', 97 97 + type: enableSquareAvatars ? 'rect-avi' : 'circle-avi', 96 98 }, 97 99 ], 98 100 index: 0, 99 101 }) 100 102 }, 101 101 - [openLightbox, highQualityImages], 103 103 + [openLightbox, highQualityImages, enableSquareAvatars], 102 104 ) 103 105 104 106 // theres probs a better way instead of just making a separate one but this works:tm: so its whatever ··· 311 313 <View 312 314 style={[ 313 315 t.atoms.bg, 314 314 - a.rounded_full, 316 316 + enableSquareAvatars ? a.rounded_md : a.rounded_full, 315 317 { 316 318 width: 94, 317 319 height: 94,

+19

src/screens/Settings/DeerSettings.tsx

··· 58 58 useSetDisableViaRepostNotification, 59 59 } from '#/state/preferences/disable-via-repost-notification' 60 60 import { 61 61 + useEnableSquareAvatars, 62 62 + useSetEnableSquareAvatars, 63 63 + } from '#/state/preferences/enable-square-avatars' 64 64 + import { 61 65 useHideFeedsPromoTab, 62 66 useSetHideFeedsPromoTab, 63 67 } from '#/state/preferences/hide-feeds-promo-tab' ··· 283 287 284 288 const hideSimilarAccountsRecomm = useHideSimilarAccountsRecomm() 285 289 const setHideSimilarAccountsRecomm = useSetHideSimilarAccountsRecomm() 290 290 + 291 291 + const enableSquareAvatars = useEnableSquareAvatars() 292 292 + const setEnableSquareAvatars = useSetEnableSquareAvatars() 286 293 287 294 const constellationInstance = useConstellationInstance() 288 295 const setConstellationInstanceControl = Dialog.useDialogControl() ··· 535 542 style={[a.w_full]}> 536 543 <Toggle.LabelText style={[a.flex_1]}> 537 544 <Trans>Hide similar accounts recommendations</Trans> 545 545 + </Toggle.LabelText> 546 546 + <Toggle.Platform /> 547 547 + </Toggle.Item> 548 548 + 549 549 + <Toggle.Item 550 550 + name="enable_square_avatars" 551 551 + label={_(msg`Enable square avatars`)} 552 552 + value={enableSquareAvatars} 553 553 + onChange={value => setEnableSquareAvatars(value)} 554 554 + style={[a.w_full]}> 555 555 + <Toggle.LabelText style={[a.flex_1]}> 556 556 + <Trans>Enable square avatars</Trans> 538 557 </Toggle.LabelText> 539 558 <Toggle.Platform /> 540 559 </Toggle.Item>

+2

src/state/persisted/schema.ts

··· 141 141 disableSavesMetrics: z.boolean().optional(), 142 142 disableReplyMetrics: z.boolean().optional(), 143 143 hideSimilarAccountsRecomm: z.boolean().optional(), 144 144 + enableSquareAvatars: z.boolean().optional(), 144 145 deerVerification: z 145 146 .object({ 146 147 enabled: z.boolean(), ··· 220 221 disableSavesMetrics: false, 221 222 disableReplyMetrics: false, 222 223 hideSimilarAccountsRecomm: false, 224 224 + enableSquareAvatars: false, 223 225 deerVerification: { 224 226 enabled: false, 225 227 // https://bitchsky.app/profile/did:plc:p2cp5gopk7mgjegy6wadk3ep/post/3lndyqyyr4k2k

+50

src/state/preferences/enable-square-avatars.tsx

··· 1 1 + import React from 'react' 2 2 + 3 3 + import * as persisted from '#/state/persisted' 4 4 + 5 5 + // Preference: enableSquareAvatars – when true, disables notifications sent when liking/reposting a post someone else reposted 6 6 + 7 7 + type StateContext = persisted.Schema['enableSquareAvatars'] 8 8 + // Same setter signature used across other preference modules 9 9 + type SetContext = (v: persisted.Schema['enableSquareAvatars']) => void 10 10 + 11 11 + const stateContext = React.createContext<StateContext>( 12 12 + persisted.defaults.enableSquareAvatars, 13 13 + ) 14 14 + const setContext = React.createContext<SetContext>( 15 15 + (_: persisted.Schema['enableSquareAvatars']) => {}, 16 16 + ) 17 17 + 18 18 + export function Provider({children}: React.PropsWithChildren<{}>) { 19 19 + const [state, setState] = React.useState(persisted.get('enableSquareAvatars')) 20 20 + 21 21 + const setStateWrapped = React.useCallback( 22 22 + (value: persisted.Schema['enableSquareAvatars']) => { 23 23 + setState(value) 24 24 + persisted.write('enableSquareAvatars', value) 25 25 + }, 26 26 + [setState], 27 27 + ) 28 28 + 29 29 + React.useEffect(() => { 30 30 + return persisted.onUpdate('enableSquareAvatars', next => { 31 31 + setState(next) 32 32 + }) 33 33 + }, [setStateWrapped]) 34 34 + 35 35 + return ( 36 36 + <stateContext.Provider value={state}> 37 37 + <setContext.Provider value={setStateWrapped}> 38 38 + {children} 39 39 + </setContext.Provider> 40 40 + </stateContext.Provider> 41 41 + ) 42 42 + } 43 43 + 44 44 + export function useEnableSquareAvatars() { 45 45 + return React.useContext(stateContext) 46 46 + } 47 47 + 48 48 + export function useSetEnableSquareAvatars() { 49 49 + return React.useContext(setContext) 50 50 + }

+4 -1

src/state/preferences/index.tsx

··· 13 13 import {Provider as DisableRepostsMetricsProvider} from './disable-reposts-metrics' 14 14 import {Provider as DisableSavesMetricsProvider} from './disable-saves-metrics' 15 15 import {Provider as DisableViaRepostNotificationProvider} from './disable-via-repost-notification' 16 16 + import {Provider as EnableSquareAvatarsProvider} from './enable-square-avatars' 16 17 import {Provider as ExternalEmbedsProvider} from './external-embeds-prefs' 17 18 import {Provider as ExternalShareButtonsProvider} from './external-share-buttons' 18 19 import {Provider as GoLinksProvider} from './go-links-enabled' ··· 85 86 <DisableSavesMetricsProvider> 86 87 <DisableReplyMetricsProvider> 87 88 <HideSimilarAccountsRecommProvider> 88 88 - {children} 89 89 + <EnableSquareAvatarsProvider> 90 90 + {children} 91 91 + </EnableSquareAvatarsProvider> 89 92 </HideSimilarAccountsRecommProvider> 90 93 </DisableReplyMetricsProvider> 91 94 </DisableSavesMetricsProvider>

+8 -1

src/view/com/util/UserAvatar.tsx

··· 34 34 compressImage, 35 35 createComposerImage, 36 36 } from '#/state/gallery' 37 37 + import {useEnableSquareAvatars} from '#/state/preferences/enable-square-avatars' 37 38 import { 38 39 maybeModifyHighQualityImage, 39 40 useHighQualityImages, ··· 227 228 noBorder, 228 229 }: UserAvatarProps): React.ReactNode => { 229 230 const t = useTheme() 230 230 - const finalShape = overrideShape ?? (type === 'user' ? 'circle' : 'square') 231 231 + 232 232 + const enableSquareAvatars = useEnableSquareAvatars() 233 233 + const avishapeforce = enableSquareAvatars ? 'square' : 'circle' 234 234 + 235 235 + const finalShape = 236 236 + overrideShape ?? (type === 'user' ? avishapeforce : 'square') 231 237 const highQualityImages = useHighQualityImages() 232 238 233 239 const aviStyle = useMemo(() => { 234 240 let borderRadius 241 241 + 235 242 if (finalShape === 'square') { 236 243 borderRadius = size > 32 ? 8 : 3 237 244 } else {