Move button filter to memoized call
This reduces re-renders
This commit is contained in:
parent
48432188c3
commit
60cc619e39
|
@ -259,7 +259,8 @@ export default function SettingsPage() {
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
const buttons = useMemo(
|
const buttons = useMemo(
|
||||||
() => [
|
() =>
|
||||||
|
[
|
||||||
{
|
{
|
||||||
name: 'Alarm sound',
|
name: 'Alarm sound',
|
||||||
element: (
|
element: (
|
||||||
|
@ -297,8 +298,8 @@ export default function SettingsPage() {
|
||||||
</Button>
|
</Button>
|
||||||
),
|
),
|
||||||
},
|
},
|
||||||
],
|
].filter(({name}) => name.toLowerCase().includes(term.toLowerCase())),
|
||||||
[changeSound, exportDatabase, soundString],
|
[changeSound, exportDatabase, soundString, term],
|
||||||
)
|
)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
@ -309,9 +310,7 @@ export default function SettingsPage() {
|
||||||
<View style={{marginTop: MARGIN}}>
|
<View style={{marginTop: MARGIN}}>
|
||||||
{switches.map(s => renderSwitch(s))}
|
{switches.map(s => renderSwitch(s))}
|
||||||
{selects.map(s => renderSelect(s))}
|
{selects.map(s => renderSelect(s))}
|
||||||
{buttons
|
{buttons.map(b => b.element)}
|
||||||
.filter(b => b.name.includes(term.toLowerCase()))
|
|
||||||
.map(b => b.element)}
|
|
||||||
</View>
|
</View>
|
||||||
</Page>
|
</Page>
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue
Block a user