cswimr/revite
1
0
Fork 0
mirror of https://github.com/revoltchat/revite.git synced 2024-12-25 23:22:06 -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

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

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

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

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