Rubicon/tutu
1
0
Fork 0
Code Issues 18 Pull requests 1 Projects 1 Activity Actions

added settings

Browse source
This commit is contained in:
thislight 2024-07-22 21:57:04 +08:00
parent 5ec00d4999
commit 5833e5a76b
15 changed files with 359 additions and 91 deletions
Download patch file Download diff file Expand all files Collapse all files

137
src/settings/Settings.tsx Normal file
View file

@ -0,0 +1,137 @@
import { createResource, For, type ParentComponent } from "solid-js";
import Scaffold from "../material/Scaffold.js";
import {
AppBar,
Divider,
IconButton,
List,
ListItem,
ListItemButton,
ListItemSecondaryAction,
ListItemText,
ListSubheader,
NativeSelect,
Select,
Switch,
Toolbar,
} from "@suid/material";
import { Close as CloseIcon } from "@suid/icons-material";
import { useNavigate } from "@solidjs/router";
import { Title } from "../material/typography.jsx";
import { useSessions } from "../masto/clients.js";
import { css } from "solid-styled";
import { useSignedInProfiles } from "../masto/acct.js";
import { signOut, type Account } from "../accounts/stores.js";
import { intlFormat } from "date-fns";
const Settings: ParentComponent = () => {
const navigate = useNavigate();
const [profiles] = useSignedInProfiles();
const doSignOut = (acct: Account) => {
signOut((a) => a.site === acct.site && a.accessToken === acct.accessToken);
};
css`
ul {
padding: 0;
}
.setting-list {
padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 16px);
}
`;
return (
<Scaffold
topbar={
<AppBar position="static">
<Toolbar variant="dense">
<IconButton onClick={[navigate, -1]}>
<CloseIcon />
</IconButton>
<Title>Settings</Title>
</Toolbar>
</AppBar>
}
>
<List class="setting-list" use:solid-styled>
<li>
<ul>
<ListSubheader>Accounts</ListSubheader>
<ListItem>
<ListItemText>All Notifications</ListItemText>
<ListItemSecondaryAction>
<Switch />
</ListItemSecondaryAction>
</ListItem>
<ListItem>
<ListItemText>Sign in...</ListItemText>
</ListItem>
</ul>
<For each={profiles()}>
{({ account: acct, inf }) => (
<ul data-site={acct.site} data-username={inf?.username}>
<ListSubheader>{`@${inf?.username ?? "..."}@${new URL(acct.site).host}`}</ListSubheader>
<ListItem>
<ListItemText>Notifications</ListItemText>
<ListItemSecondaryAction>
<Switch />
</ListItemSecondaryAction>
</ListItem>
<ListItemButton onClick={[doSignOut, acct]}>
<ListItemText>Sign out</ListItemText>
</ListItemButton>
</ul>
)}
</For>
</li>
<li>
<ListSubheader>Reading</ListSubheader>
<ListItem>
<ListItemText secondary="Regular">Fonts</ListItemText>
</ListItem>
<ListItem>
<ListItemText secondary="Tutu will download toots before you scroll to the position.">
Prefetch Toots
</ListItemText>
<ListItemSecondaryAction>
<Switch />
</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>
</ListItem>
</li>
<li>
<ListSubheader>This Application</ListSubheader>
<ListItem>
<ListItemText secondary="Comformtable tooting experience.">
About Tutu
</ListItemText>
</ListItem>
<ListItem>
<ListItemText
secondary={`Using v${import.meta.env.PACKAGE_VERSION} (built on ${intlFormat(import.meta.env.BUILT_AT)}, ${import.meta.env.MODE})`}
>
No updates
</ListItemText>
</ListItem>
</li>
</List>
</Scaffold>
);
};
export default Settings;