Unblock React Compiler for 5 components by removing render-phase mutation
Four shapes of writing to something the compiler has frozen: - Reanimated shared values written as `sv.value = x`, now `sv.set(x)` to match the sibling calls already in those files - debug globals installed during render, now installed in an effect - a running flag mutated inside a `.filter()` callback, now a plain loop - tagging metadata inside a hook, now a module-scope helper Skipped components: 125 -> 120. Composer also loses its Immutability error but stays skipped on a Refs error underneath. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -11,14 +11,18 @@ import {
|
||||
* Thin `useMemo` wrapper that marks the metadata as memoized and provides a
|
||||
* type guard.
|
||||
*/
|
||||
export function useMeta(metadata?: MergeableMetadata) {
|
||||
const m = useMemo(() => metadata, [metadata])
|
||||
if (!m) return
|
||||
function markMemoized<T extends MergeableMetadata>(m: T): T {
|
||||
// @ts-expect-error
|
||||
m.__meta = true
|
||||
return m
|
||||
}
|
||||
|
||||
export function useMeta(metadata?: MergeableMetadata) {
|
||||
const m = useMemo(() => metadata, [metadata])
|
||||
if (!m) return
|
||||
return markMemoized(m)
|
||||
}
|
||||
|
||||
export function accountToSessionMetadata(
|
||||
account: SessionAccount | undefined,
|
||||
): SessionMetadata | undefined {
|
||||
|
||||
@@ -362,9 +362,9 @@ export function Composer({
|
||||
onKeyPress={IS_WEB ? onKeyPressWeb : undefined}
|
||||
onScroll={e => {
|
||||
if (IS_WEB) {
|
||||
inputScrollSharedValue.value = (e.target as any).scrollTop
|
||||
inputScrollSharedValue.set((e.target as any).scrollTop)
|
||||
} else {
|
||||
inputScrollSharedValue.value = e.nativeEvent.contentOffset.y
|
||||
inputScrollSharedValue.set(e.nativeEvent.contentOffset.y)
|
||||
}
|
||||
}}
|
||||
// @ts-expect-error web only
|
||||
|
||||
@@ -116,14 +116,15 @@ function Inner({
|
||||
setActiveNux(undefined)
|
||||
}, [activeNux, setActiveNux])
|
||||
|
||||
if (__DEV__ && typeof window !== 'undefined') {
|
||||
// @ts-expect-error
|
||||
useEffect(() => {
|
||||
if (!__DEV__ || typeof window === 'undefined') return
|
||||
// @ts-expect-error debug only
|
||||
window.clearNuxDialog = (id: Nux) => {
|
||||
if (!__DEV__ || !id) return
|
||||
if (!id) return
|
||||
resetNuxs([id])
|
||||
unsnooze()
|
||||
}
|
||||
}
|
||||
}, [resetNuxs])
|
||||
|
||||
useEffect(() => {
|
||||
if (snoozed) return // comment this out to test
|
||||
|
||||
@@ -101,35 +101,33 @@ function ContentHiderActive({
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* A plain loop rather than `.filter()`: the running flag has to be mutated
|
||||
* from the enclosing scope, which React Compiler cannot lower inside a
|
||||
* callback. Keeps only the first adult-content label, as before.
|
||||
*/
|
||||
const selfBlurCauses = []
|
||||
let hasAdultContentLabel = false
|
||||
const selfBlurNames = modui.blurs
|
||||
.filter(cause => {
|
||||
if (cause.type !== 'label') {
|
||||
return false
|
||||
}
|
||||
if (cause.source.type !== 'user') {
|
||||
return false
|
||||
}
|
||||
if (ADULT_CONTENT_LABELS.includes(cause.label.val as AdultSelfLabel)) {
|
||||
if (hasAdultContentLabel) {
|
||||
return false
|
||||
}
|
||||
hasAdultContentLabel = true
|
||||
}
|
||||
return true
|
||||
})
|
||||
.slice(0, 2)
|
||||
.map(cause => {
|
||||
if (cause.type !== 'label') {
|
||||
return
|
||||
}
|
||||
for (const cause of modui.blurs) {
|
||||
if (cause.type !== 'label') continue
|
||||
if (cause.source.type !== 'user') continue
|
||||
if (ADULT_CONTENT_LABELS.includes(cause.label.val as AdultSelfLabel)) {
|
||||
if (hasAdultContentLabel) continue
|
||||
hasAdultContentLabel = true
|
||||
}
|
||||
selfBlurCauses.push(cause)
|
||||
}
|
||||
const selfBlurNames = selfBlurCauses.slice(0, 2).map(cause => {
|
||||
if (cause.type !== 'label') {
|
||||
return
|
||||
}
|
||||
|
||||
const def = cause.labelDef || getDefinition(labelDefs, cause.label)
|
||||
if (def.identifier === 'porn' || def.identifier === 'sexual') {
|
||||
return l`Adult Content`
|
||||
}
|
||||
return getLabelStrings(i18n.locale, globalLabelStrings, def).name
|
||||
})
|
||||
const def = cause.labelDef || getDefinition(labelDefs, cause.label)
|
||||
if (def.identifier === 'porn' || def.identifier === 'sexual') {
|
||||
return l`Adult Content`
|
||||
}
|
||||
return getLabelStrings(i18n.locale, globalLabelStrings, def).name
|
||||
})
|
||||
|
||||
if (selfBlurNames.length === 0) {
|
||||
return desc.name
|
||||
|
||||
@@ -683,9 +683,11 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
|
||||
const bundle = state.currentBundleState.bundle as unknown as
|
||||
SessionBundle | PublicSessionBundle
|
||||
|
||||
// @ts-expect-error window type is not declared, debug only
|
||||
// eslint-disable-next-line react-hooks/immutability
|
||||
if (__DEV__ && IS_WEB) window.bundle = bundle
|
||||
useEffect(() => {
|
||||
if (!__DEV__ || !IS_WEB) return
|
||||
// @ts-expect-error window type is not declared, debug only
|
||||
window.bundle = bundle
|
||||
}, [bundle])
|
||||
|
||||
const currentBundleRef = useRef(bundle)
|
||||
/*
|
||||
|
||||
@@ -332,7 +332,7 @@ export function TabBar({
|
||||
syncScrollState.set('unsynced')
|
||||
}}
|
||||
onScroll={e => {
|
||||
scrollX.value = Math.round(e.nativeEvent.contentOffset.x)
|
||||
scrollX.set(Math.round(e.nativeEvent.contentOffset.x))
|
||||
}}>
|
||||
<Animated.View
|
||||
onLayout={e => {
|
||||
|
||||
Reference in New Issue
Block a user