Compare commits

..

No commits in common. "1115135380d8b45cedf13f4dce952f53dda42ae6" and "af9f111b27a5fafdf5578a124aa573f92b4a4fea" have entirely different histories.

5 changed files with 30 additions and 86 deletions

View file

@ -15,8 +15,6 @@ import {
useContext, useContext,
onCleanup, onCleanup,
type Accessor, type Accessor,
useTransition,
getOwner,
} from "solid-js"; } from "solid-js";
import { createStore, unwrap } from "solid-js/store"; import { createStore, unwrap } from "solid-js/store";
import "./StackedRouter.css"; import "./StackedRouter.css";
@ -81,8 +79,8 @@ export type NewFrameOptions<T> = (T extends undefined
export type FramePusher<T, K extends keyof T = keyof T> = T[K] extends export type FramePusher<T, K extends keyof T = keyof T> = T[K] extends
| undefined | undefined
| any | any
? (path: K, state?: Readonly<NewFrameOptions<T[K]>>) => Promise<Readonly<StackFrame>> ? (path: K, state?: Readonly<NewFrameOptions<T[K]>>) => Readonly<StackFrame>
: (path: K, state: Readonly<NewFrameOptions<T[K]>>) => Promise<Readonly<StackFrame>>; : (path: K, state: Readonly<NewFrameOptions<T[K]>>) => Readonly<StackFrame>;
export type Navigator<PushGuide = Record<string, any>> = { export type Navigator<PushGuide = Record<string, any>> = {
frames: readonly StackFrame[]; frames: readonly StackFrame[];
@ -467,8 +465,6 @@ const StackedRouter: Component<StackedRouterProps> = (oprops) => {
const [stack, mutStack] = createStore([] as StackFrame[], { name: "stack" }); const [stack, mutStack] = createStore([] as StackFrame[], { name: "stack" });
const windowSize = useWindowSize(); const windowSize = useWindowSize();
const [, startTransition] = useTransition();
if (import.meta.hot) { if (import.meta.hot) {
const saveStack = () => { const saveStack = () => {
import.meta.hot!.data[$StackedRouterSavedStack] = unwrap(stack); import.meta.hot!.data[$StackedRouterSavedStack] = unwrap(stack);
@ -492,8 +488,8 @@ const StackedRouter: Component<StackedRouterProps> = (oprops) => {
}); });
} }
const pushFrame = async (path: string, opts?: Readonly<NewFrameOptions<any>>) => const pushFrame = (path: string, opts?: Readonly<NewFrameOptions<any>>) =>
await untrack(async () => { untrack(() => {
const frame = { const frame = {
path, path,
state: opts?.state, state: opts?.state,
@ -503,17 +499,14 @@ const StackedRouter: Component<StackedRouterProps> = (oprops) => {
}; };
const replace = opts?.replace; const replace = opts?.replace;
const length = stack.length; if (replace === "all" || stack.length === 0) {
await startTransition(() => { mutStack([frame]);
if (replace === "all" || length === 0) { } else if (replace) {
mutStack([frame]); const idx = stack.length - 1;
} else if (replace) { mutStack(idx, frame);
const idx = length - 1; } else {
mutStack(idx, frame); mutStack(stack.length, frame);
} else { }
mutStack(length, frame);
}
});
const savedStack = serializableStack(stack); const savedStack = serializableStack(stack);
@ -522,7 +515,6 @@ const StackedRouter: Component<StackedRouterProps> = (oprops) => {
} else { } else {
window.history.pushState(savedStack, "", path); window.history.pushState(savedStack, "", path);
} }
return frame; return frame;
}); });

View file

@ -1,23 +1,27 @@
import { import {
createSignal, createSignal,
Show, Show,
onMount,
type ParentComponent, type ParentComponent,
createRenderEffect,
createEffect, createEffect,
useTransition,
} from "solid-js"; } from "solid-js";
import { useDocumentTitle } from "../utils"; import { useDocumentTitle } from "../utils";
import Scaffold from "~material/Scaffold"; import Scaffold from "~material/Scaffold";
import { import {
AppBar,
ListItemSecondaryAction, ListItemSecondaryAction,
ListItemText, ListItemText,
MenuItem, MenuItem,
Switch, Switch,
Toolbar,
} from "@suid/material"; } from "@suid/material";
import { css } from "solid-styled"; import { css } from "solid-styled";
import { TimeSourceProvider, createTimeSource } from "~platform/timesrc"; import { TimeSourceProvider, createTimeSource } from "~platform/timesrc";
import ProfileMenuButton from "./ProfileMenuButton"; import ProfileMenuButton from "./ProfileMenuButton";
import Tabs from "~material/Tabs"; import Tabs from "~material/Tabs";
import Tab from "~material/Tab"; import Tab from "~material/Tab";
import { makeEventListener } from "@solid-primitives/event-listener";
import { $settings } from "../settings/stores"; import { $settings } from "../settings/stores";
import { useStore } from "@nanostores/solid"; import { useStore } from "@nanostores/solid";
import TrendTimelinePanel from "./TrendTimelinePanel"; import TrendTimelinePanel from "./TrendTimelinePanel";
@ -28,20 +32,10 @@ import {
default as ItemSelectionProvider, default as ItemSelectionProvider,
} from "./toots/ItemSelectionProvider"; } from "./toots/ItemSelectionProvider";
import AppTopBar from "~material/AppTopBar"; import AppTopBar from "~material/AppTopBar";
import { createTranslator } from "~platform/i18n";
import { useWindowSize } from "@solid-primitives/resize-observer";
type StringRes = Record<
"tabs.home" | "tabs.trending" | "tabs.public" | "set.prefetch-toots",
string
>;
const Home: ParentComponent = (props) => { const Home: ParentComponent = (props) => {
let panelList: HTMLDivElement; let panelList: HTMLDivElement;
useDocumentTitle("Timelines"); useDocumentTitle("Timelines");
const [t] = createTranslator(
(code) => import(`./i18n/${code}.json`) as Promise<{ default: StringRes }>,
);
const now = createTimeSource(); const now = createTimeSource();
const [, selectionState] = createSingluarItemSelection( const [, selectionState] = createSingluarItemSelection(
undefined as string | undefined, undefined as string | undefined,
@ -104,19 +98,10 @@ const Home: ParentComponent = (props) => {
} }
}; };
const windowSize = useWindowSize();
createEffect((last) => {
if (last !== windowSize.width) {
requestRecalculateTabIndicator();
}
});
const [inTransition] = useTransition();
createEffect(() => { createEffect(() => {
if (!inTransition()) { makeEventListener(window, "resize", requestRecalculateTabIndicator);
requestAnimationFrame(recalculateTabIndicator);
} requestAnimationFrame(recalculateTabIndicator);
}); });
const isTabFocus = (idx: number) => { const isTabFocus = (idx: number) => {
@ -184,13 +169,13 @@ const Home: ParentComponent = (props) => {
<AppTopBar> <AppTopBar>
<Tabs> <Tabs>
<Tab focus={isTabFocus(0)} onClick={[onTabClick, 0]}> <Tab focus={isTabFocus(0)} onClick={[onTabClick, 0]}>
{t("tabs.home")} Home
</Tab> </Tab>
<Tab focus={isTabFocus(1)} onClick={[onTabClick, 1]}> <Tab focus={isTabFocus(1)} onClick={[onTabClick, 1]}>
{t("tabs.trending")} Trending
</Tab> </Tab>
<Tab focus={isTabFocus(2)} onClick={[onTabClick, 2]}> <Tab focus={isTabFocus(2)} onClick={[onTabClick, 2]}>
{t("tabs.public")} Public
</Tab> </Tab>
</Tabs> </Tabs>
<ProfileMenuButton profile={profiles()[0]}> <ProfileMenuButton profile={profiles()[0]}>
@ -202,7 +187,7 @@ const Home: ParentComponent = (props) => {
) )
} }
> >
<ListItemText>{t("set.prefetch-toots")}</ListItemText> <ListItemText>Prefetch Toots</ListItemText>
<ListItemSecondaryAction> <ListItemSecondaryAction>
<Switch checked={prefetching()}></Switch> <Switch checked={prefetching()}></Switch>
</ListItemSecondaryAction> </ListItemSecondaryAction>

View file

@ -16,12 +16,6 @@ import {
} from "@suid/icons-material"; } from "@suid/icons-material";
import A from "~platform/A"; import A from "~platform/A";
import Menu, { createManagedMenuState } from "~material/Menu"; import Menu, { createManagedMenuState } from "~material/Menu";
import { createTranslator } from "~platform/i18n";
type StringRes = Record<
"nav.bookmarks" | "nav.likes" | "nav.lists" | "nav.settings",
string
>;
const ProfileMenuButton: ParentComponent<{ const ProfileMenuButton: ParentComponent<{
profile?: { profile?: {
@ -38,10 +32,6 @@ const ProfileMenuButton: ParentComponent<{
}> = (props) => { }> = (props) => {
const menuId = createUniqueId(); const menuId = createUniqueId();
const buttonId = createUniqueId(); const buttonId = createUniqueId();
const [t] = createTranslator(
async (code) =>
(await import(`./i18n/${code}.json`)) as { default: StringRes },
);
const [open, state] = createManagedMenuState(); const [open, state] = createManagedMenuState();
@ -94,19 +84,19 @@ const ProfileMenuButton: ParentComponent<{
<ListItemIcon> <ListItemIcon>
<BookmarkIcon /> <BookmarkIcon />
</ListItemIcon> </ListItemIcon>
<ListItemText>{t("nav.bookmarks")}</ListItemText> <ListItemText>Bookmarks</ListItemText>
</MenuItem> </MenuItem>
<MenuItem disabled> <MenuItem disabled>
<ListItemIcon> <ListItemIcon>
<LikeIcon /> <LikeIcon />
</ListItemIcon> </ListItemIcon>
<ListItemText>{t("nav.likes")}</ListItemText> <ListItemText>Likes</ListItemText>
</MenuItem> </MenuItem>
<MenuItem disabled> <MenuItem disabled>
<ListItemIcon> <ListItemIcon>
<ListIcon /> <ListIcon />
</ListItemIcon> </ListItemIcon>
<ListItemText>{t("nav.lists")}</ListItemText> <ListItemText>Lists</ListItemText>
</MenuItem> </MenuItem>
<Divider /> <Divider />
<Show when={props.children}> <Show when={props.children}>
@ -117,7 +107,7 @@ const ProfileMenuButton: ParentComponent<{
<ListItemIcon> <ListItemIcon>
<SettingsIcon /> <SettingsIcon />
</ListItemIcon> </ListItemIcon>
<ListItemText>{t("nav.settings")}</ListItemText> <ListItemText>Settings</ListItemText>
</MenuItem> </MenuItem>
</Menu> </Menu>
</> </>

View file

@ -1,15 +1,3 @@
{ {
"Choose Language": "Choose Language", "Choose Language": "Choose Language"
"tabs.home": "Home",
"tabs.trending": "Trending",
"tabs.public": "Public",
"set.prefetch-toots": "Prefetch Toots",
"nav.bookmarks": "Bookmarks",
"nav.likes": "Likes",
"nav.lists": "Lists",
"nav.settings": "Settings"
} }

View file

@ -1,14 +1,3 @@
{ {
"Choose Language": "选择语言", "Choose Language": "选择语言"
"tabs.home": "主页",
"tabs.trending": "当下热门",
"tabs.public": "公开",
"set.prefetch-toots": "提前下载嘟文",
"nav.bookmarks": "所有书签",
"nav.likes": "喜欢的嘟文",
"nav.lists": "所有列表",
"nav.settings": "设置"
} }