cswimr/revite
1
0
Fork 0
mirror of https://github.com/revoltchat/revite.git synced 2024-12-26 07:22:10 -05:00
Code Issues Projects Releases Packages Wiki Activity

Add settings closing animation.

Browse source
This commit is contained in:
Paul 2021-08-01 21:55:13 +01:00
parent fd010ed75e
commit ed826cf1bb
2 changed files with 37 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/pages/settings/GenericSettings.tsx
View file

@ -26,6 +26,7 @@ interface Props {
id: string; id: string;
icon: Children; icon: Children;
title: Children; title: Children;
hidden?: boolean;
hideTitle?: boolean; hideTitle?: boolean;
}[]; }[];
custom?: Children; custom?: Children;
@ -51,15 +52,15 @@ export function GenericSettings({
const [closing, setClosing] = useState(false); const [closing, setClosing] = useState(false);
function exitSettings() { function exitSettings() {
if (history.length > 1) {
setClosing(true); setClosing(true);
setTimeout(() => { setTimeout(() => {
if (history.length > 0) {
history.goBack(); history.goBack();
}, 100);
} else { } else {
history.push("/"); history.push("/");
} }
}, 100);
} }
useEffect(() => { useEffect(() => {
@ -77,6 +78,7 @@ export function GenericSettings({
<div <div
className={classNames(styles.settings, { className={classNames(styles.settings, {
[styles.closing]: closing, [styles.closing]: closing,
[styles.native]: window.isNative,
})} })}
data-mobile={isTouchscreenDevice}> data-mobile={isTouchscreenDevice}>
<Helmet> <Helmet>
@ -121,7 +123,8 @@ export function GenericSettings({
{(!isTouchscreenDevice || typeof page === "undefined") && ( {(!isTouchscreenDevice || typeof page === "undefined") && (
<div className={styles.sidebar}> <div className={styles.sidebar}>
<div className={styles.container}> <div className={styles.container}>
{pages.map((entry, i) => ( {pages.map((entry, i) =>
entry.hidden ? undefined : (
<> <>
{entry.category && ( {entry.category && (
<Category <Category
@ -142,7 +145,8 @@ export function GenericSettings({
</ButtonItem> </ButtonItem>
{entry.divider && <LineDivider />} {entry.divider && <LineDivider />}
</> </>
))} ),
)}
{custom} {custom}
</div> </div>
</div> </div>

5
src/pages/settings/Settings.tsx
View file

@ -104,6 +104,7 @@ export default function Settings() {
}, },
{ {
id: "native", id: "native",
hidden: !window.isNative,
icon: <Desktop size={20} />, icon: <Desktop size={20} />,
title: <Text id="app.settings.pages.native.title" />, title: <Text id="app.settings.pages.native.title" />,
}, },
@ -140,11 +141,9 @@ export default function Settings() {
<Route path="/settings/sync"> <Route path="/settings/sync">
<Sync /> <Sync />
</Route>, </Route>,
window.isNative && (
<Route path="/settings/native"> <Route path="/settings/native">
<Native /> <Native />
</Route> </Route>,
),
<Route path="/settings/experiments"> <Route path="/settings/experiments">
<ExperimentsPage /> <ExperimentsPage />
</Route>, </Route>,