Rubicon/tutu
1
0
Fork 0
Code Issues 13 Pull requests Projects 2 Releases Activity Actions

Settings: ask user to refresh if update available
All checks were successful
/ depoly (push) Successful in 1m7s
Details

Browse source
This commit is contained in:
thislight 2024-09-14 19:55:37 +08:00
parent 3afda89dfc
commit 724eb17391
No known key found for this signature in database
GPG key ID: A50F9451AC56A63E
2 changed files with 43 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

71
src/settings/Settings.tsx
View file

@ -1,4 +1,4 @@
import { createResource, For, type ParentComponent } from "solid-js"; import { For, Show, type ParentComponent } from "solid-js";
import Scaffold from "../material/Scaffold.js"; import Scaffold from "../material/Scaffold.js";
import { import {
AppBar, AppBar,
@ -10,25 +10,29 @@ import {
ListItemSecondaryAction, ListItemSecondaryAction,
ListItemText, ListItemText,
ListSubheader, ListSubheader,
NativeSelect,
Select,
Switch, Switch,
Toolbar, Toolbar,
} from "@suid/material"; } from "@suid/material";
import { Close as CloseIcon } from "@suid/icons-material"; import {
Close as CloseIcon,
Refresh as RefreshIcon,
} from "@suid/icons-material";
import { useNavigate } from "@solidjs/router"; import { useNavigate } from "@solidjs/router";
import { Title } from "../material/typography.jsx"; import { Title } from "../material/typography.jsx";
import { useSessions } from "../masto/clients.js";
import { css } from "solid-styled"; import { css } from "solid-styled";
import { useSignedInProfiles } from "../masto/acct.js"; import { useSignedInProfiles } from "../masto/acct.js";
import { signOut, type Account } from "../accounts/stores.js"; import { signOut, type Account } from "../accounts/stores.js";
import { intlFormat } from "date-fns"; import { intlFormat } from "date-fns";
import { useStore } from "@nanostores/solid"; import { useStore } from "@nanostores/solid";
import { $settings } from "./stores.js"; import { $settings } from "./stores.js";
import { useRegisterSW } from "virtual:pwa-register/solid";
const Settings: ParentComponent = () => { const Settings: ParentComponent = () => {
const navigate = useNavigate(); const navigate = useNavigate();
const settings$ = useStore($settings); const settings$ = useStore($settings);
const {
needRefresh: [needRefresh],
} = useRegisterSW();
const [profiles] = useSignedInProfiles(); const [profiles] = useSignedInProfiles();
@ -49,7 +53,10 @@ const Settings: ParentComponent = () => {
<Scaffold <Scaffold
topbar={ topbar={
<AppBar position="static"> <AppBar position="static">
<Toolbar variant="dense" sx={{paddingTop: "var(--safe-area-inset-top, 0px)"}}> <Toolbar
variant="dense"
sx={{ paddingTop: "var(--safe-area-inset-top, 0px)" }}
>
<IconButton color="inherit" onClick={[navigate, -1]} disableRipple> <IconButton color="inherit" onClick={[navigate, -1]} disableRipple>
<CloseIcon /> <CloseIcon />
</IconButton> </IconButton>
@ -65,12 +72,14 @@ const Settings: ParentComponent = () => {
<ListItem> <ListItem>
<ListItemText>All Notifications</ListItemText> <ListItemText>All Notifications</ListItemText>
<ListItemSecondaryAction> <ListItemSecondaryAction>
<Switch /> <Switch value={false} />
</ListItemSecondaryAction> </ListItemSecondaryAction>
</ListItem> </ListItem>
<Divider />
<ListItem> <ListItem>
<ListItemText>Sign in...</ListItemText> <ListItemText>Sign in...</ListItemText>
</ListItem> </ListItem>
<Divider />
</ul> </ul>
<For each={profiles()}> <For each={profiles()}>
{({ account: acct, inf }) => ( {({ account: acct, inf }) => (
@ -79,12 +88,14 @@ const Settings: ParentComponent = () => {
<ListItem> <ListItem>
<ListItemText>Notifications</ListItemText> <ListItemText>Notifications</ListItemText>
<ListItemSecondaryAction> <ListItemSecondaryAction>
<Switch /> <Switch value={false} />
</ListItemSecondaryAction> </ListItemSecondaryAction>
</ListItem> </ListItem>
<Divider />
<ListItemButton onClick={[doSignOut, acct]}> <ListItemButton onClick={[doSignOut, acct]}>
<ListItemText>Sign out</ListItemText> <ListItemText>Sign out</ListItemText>
</ListItemButton> </ListItemButton>
<Divider />
</ul> </ul>
)} )}
</For> </For>
@ -94,32 +105,23 @@ const Settings: ParentComponent = () => {
<ListItem> <ListItem>
<ListItemText secondary="Regular">Fonts</ListItemText> <ListItemText secondary="Regular">Fonts</ListItemText>
</ListItem> </ListItem>
<ListItem onClick={(e) => <Divider />
$settings.setKey("prefetchTootsDisabled", !settings$().prefetchTootsDisabled) <ListItem
}> onClick={(e) =>
$settings.setKey(
"prefetchTootsDisabled",
!settings$().prefetchTootsDisabled,
)
}
>
<ListItemText secondary="Tutu will download toots before you scroll to the position."> <ListItemText secondary="Tutu will download toots before you scroll to the position.">
Prefetch Toots Prefetch Toots
</ListItemText> </ListItemText>
<ListItemSecondaryAction> <ListItemSecondaryAction>
<Switch <Switch checked={!settings$().prefetchTootsDisabled} />
checked={!settings$().prefetchTootsDisabled}
/>
</ListItemSecondaryAction>
</ListItem>
</li>
<li>
<ListSubheader>Controls</ListSubheader>
<ListItem>
<ListItemText>Optimized UI</ListItemText>
<ListItemSecondaryAction>
<NativeSelect value="auto">
<option value="auto">Tutu Decides (Mouse)</option>
<option value="mouse">Mouse</option>
<option value="touch">Touch</option>
<option value="controlpad">Control Pad</option>
</NativeSelect>
</ListItemSecondaryAction> </ListItemSecondaryAction>
</ListItem> </ListItem>
<Divider />
</li> </li>
<li> <li>
<ListSubheader>This Application</ListSubheader> <ListSubheader>This Application</ListSubheader>
@ -128,13 +130,24 @@ const Settings: ParentComponent = () => {
About Tutu About Tutu
</ListItemText> </ListItemText>
</ListItem> </ListItem>
<Divider />
<ListItem> <ListItem>
<ListItemText <ListItemText
secondary={`Using v${import.meta.env.PACKAGE_VERSION} (built on ${intlFormat(import.meta.env.BUILT_AT)}, ${import.meta.env.MODE})`} secondary={`Using v${import.meta.env.PACKAGE_VERSION} (built on ${intlFormat(import.meta.env.BUILT_AT)}, ${import.meta.env.MODE})`}
> >
No updates {needRefresh()
? "An update is ready, restart the Tutu to apply"
: "No updates"}
</ListItemText> </ListItemText>
<Show when={needRefresh()}>
<ListItemSecondaryAction>
<IconButton aria-label="Restart Now" onClick={() => window.location.reload()}>
<RefreshIcon />
</IconButton>
</ListItemSecondaryAction>
</Show>
</ListItem> </ListItem>
<Divider />
</li> </li>
</List> </List>
</Scaffold> </Scaffold>

2
tsconfig.json
View file

@ -8,7 +8,7 @@
"esModuleInterop": true, "esModuleInterop": true,
"jsx": "preserve", "jsx": "preserve",
"jsxImportSource": "solid-js", "jsxImportSource": "solid-js",
"types": ["vite/client"], "types": ["vite/client", "vite-plugin-pwa/solid"],
"noEmit": true, "noEmit": true,
"isolatedModules": true, "isolatedModules": true,
} }