rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Multiple minor changes (#769)

Browse Source
This commit is contained in:
Aman Harwara
2021-12-10 18:58:29 +05:30
committed by GitHub
parent 024d44f1ff
commit 24c6b831c6
2 changed files with 68 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
app/assets/javascripts/components/QuickSettingsMenu/QuickSettingsMenu.tsx
View File

@@ -76,55 +76,67 @@ const QuickSettingsMenu: FunctionComponent<MenuProps> = observer(
}, [focusModeEnabled]);
const reloadThemes = useCallback(() => {
application.streamItems(ContentType.Theme, () => {
const themes = application.getDisplayableItems(
ContentType.Theme
) as SNTheme[];
setThemes(
themes.sort((a, b) => {
const aIsLayerable = a.isLayerable();
const bIsLayerable = b.isLayerable();
const themes = application.getDisplayableItems(
ContentType.Theme
) as SNTheme[];
setThemes(
themes.sort((a, b) => {
const aIsLayerable = a.isLayerable();
const bIsLayerable = b.isLayerable();
if (aIsLayerable && !bIsLayerable) {
return 1;
} else if (!aIsLayerable && bIsLayerable) {
return -1;
} else {
return a.package_info.name.toLowerCase() <
b.package_info.name.toLowerCase()
? -1
: 1;
}
})
);
setDefaultThemeOn(
!themes.find((theme) => theme.active && !theme.isLayerable())
);
});
if (aIsLayerable && !bIsLayerable) {
return 1;
} else if (!aIsLayerable && bIsLayerable) {
return -1;
} else {
return a.package_info.name.toLowerCase() <
b.package_info.name.toLowerCase()
? -1
: 1;
}
})
);
setDefaultThemeOn(
!themes.find((theme) => theme.active && !theme.isLayerable())
);
}, [application]);
const reloadToggleableComponents = useCallback(() => {
application.streamItems(ContentType.Component, () => {
const toggleableComponents = (
application.getDisplayableItems(
ContentType.Component
) as SNComponent[]
).filter((component) =>
[ComponentArea.EditorStack, ComponentArea.TagsList].includes(
component.area
)
);
setToggleableComponents(toggleableComponents);
});
const toggleableComponents = (
application.getDisplayableItems(ContentType.Component) as SNComponent[]
).filter((component) =>
[ComponentArea.EditorStack, ComponentArea.TagsList].includes(
component.area
)
);
setToggleableComponents(toggleableComponents);
}, [application]);
useEffect(() => {
reloadThemes();
}, [reloadThemes]);
const cleanupItemStream = application.streamItems(
ContentType.Theme,
() => {
reloadThemes();
}
);
return () => {
cleanupItemStream();
};
}, [application, reloadThemes]);
useEffect(() => {
reloadToggleableComponents();
}, [reloadToggleableComponents]);
const cleanupItemStream = application.streamItems(
ContentType.Component,
() => {
reloadToggleableComponents();
}
);
return () => {
cleanupItemStream();
};
}, [application, reloadToggleableComponents]);
useEffect(() => {
if (themesMenuOpen) {
@@ -274,10 +286,9 @@ const QuickSettingsMenu: FunctionComponent<MenuProps> = observer(
</Disclosure>
) : null}
{toggleableComponents.map((component) => (
<Switch
className="sn-dropdown-item focus:bg-info-backdrop focus:shadow-none"
checked={component.active}
onChange={() => {
<button
className="sn-dropdown-item justify-between focus:bg-info-backdrop focus:shadow-none"
onClick={() => {
toggleComponent(component);
}}
>
@@ -285,7 +296,8 @@ const QuickSettingsMenu: FunctionComponent<MenuProps> = observer(
<Icon type="window" className="color-neutral mr-2" />
{component.name}
</div>
</Switch>
<Switch checked={component.active} className="px-0" />
</button>
))}
<FocusModeSwitch
application={application}