BottomSheet: backward animation

This commit is contained in:
thislight 2024-08-12 21:55:26 +08:00
parent 6e014324de
commit 80de0e52ee
9 changed files with 150 additions and 75 deletions

View file

@ -8,9 +8,9 @@ import {
onMount,
type ParentComponent,
children,
Suspense,
} from "solid-js";
import { useDocumentTitle } from "../utils";
import { useSessions } from "../masto/clients";
import { type mastodon } from "masto";
import Scaffold from "../material/Scaffold";
import {
@ -27,7 +27,6 @@ import {
import { css } from "solid-styled";
import { TimeSourceProvider, createTimeSource } from "../platform/timesrc";
import TootThread from "./TootThread.js";
import { useAcctProfile } from "../masto/acct";
import ProfileMenuButton from "./ProfileMenuButton";
import Tabs from "../material/Tabs";
import Tab from "../material/Tab";
@ -43,6 +42,7 @@ import { vibrate } from "../platform/hardware";
import PullDownToRefresh from "./PullDownToRefresh";
import { HeroSourceProvider, type HeroSource } from "../platform/anim";
import { useNavigate } from "@solidjs/router";
import { useSignedInProfiles } from "../masto/acct";
const TimelinePanel: Component<{
client: mastodon.rest.Client;
@ -146,7 +146,7 @@ const TimelinePanel: Component<{
onExpandChange={(x) => {
if (item.id !== expandedThreadId()) {
setExpandedThreadId(item.id);
} else if (x === 2){
} else if (x === 2) {
props.openFullScreenToot(item, element);
}
}}
@ -195,9 +195,10 @@ const Home: ParentComponent = (props) => {
const now = createTimeSource();
const settings$ = useStore($settings);
const sessions = useSessions();
const client = () => sessions()[0].client;
const [profile] = useAcctProfile(client);
const [profiles] = useSignedInProfiles();
const profile = () => profiles()[0].inf;
const client = () => profiles()[0].client;
const navigate = useNavigate();
const [heroSrc, setHeroSrc] = createSignal<HeroSource>({});
@ -278,10 +279,10 @@ const Home: ParentComponent = (props) => {
toot: mastodon.v1.Status,
srcElement?: HTMLElement,
) => {
const p = sessions()[0];
const p = profiles()[0];
const inf = p.account.inf ?? profile();
if (!inf) {
console.warn('no account info?')
console.warn("no account info?");
return;
}
const rect = srcElement?.getBoundingClientRect();
@ -402,9 +403,11 @@ const Home: ParentComponent = (props) => {
<div></div>
</div>
</TimeSourceProvider>
<HeroSourceProvider value={[heroSrc, setHeroSrc]}>
<BottomSheet open={!!child()}>{child()}</BottomSheet>
</HeroSourceProvider>
<Suspense>
<HeroSourceProvider value={[heroSrc, setHeroSrc]}>
<BottomSheet open={!!child()}>{child()}</BottomSheet>
</HeroSourceProvider>
</Suspense>
</Scaffold>
</>
);