Formatted, updated convs & comms list to not depend on each other, updated legal & login screen for better mobile support
This commit is contained in:
parent
aa8dfe2fca
commit
741afdeaa9
9 changed files with 54 additions and 22 deletions
|
|
@ -107,18 +107,23 @@ export default function Form() {
|
|||
const response = await fetch(
|
||||
`https://omega.tensamin.net/api/get/id/${inputParse.data.username}`,
|
||||
);
|
||||
const data = await response.json();
|
||||
const parse = fetchedUser.safeParse(data);
|
||||
const rawData = await response.arrayBuffer();
|
||||
|
||||
const bytes = new Uint8Array(rawData);
|
||||
const jsonString = new TextDecoder().decode(bytes);
|
||||
const data = JSON.parse(jsonString);
|
||||
|
||||
const parse = fetchedUser.shape.data.safeParse(data);
|
||||
|
||||
if (!parse.success) {
|
||||
log(0, "Login", "red", "Invalid response from server");
|
||||
log(0, "Login", "red", "Invalid response from server", parse.error);
|
||||
toast("error", "Invalid response from server");
|
||||
return;
|
||||
}
|
||||
|
||||
const user = parse.data;
|
||||
|
||||
await save("user_id", user.data.user_id);
|
||||
await save("user_id", user.user_id);
|
||||
await save("private_key", inputParse.data.private_key);
|
||||
|
||||
navigate({ to: "/" });
|
||||
|
|
@ -131,7 +136,7 @@ export default function Form() {
|
|||
);
|
||||
|
||||
return (
|
||||
<div className="flex gap-15">
|
||||
<div className="flex md:flex-row flex-col gap-15">
|
||||
<div
|
||||
onClick={() => uploadRef.current?.click()}
|
||||
className="flex flex-col gap-3 cursor-pointer w-55 aspect-square bg-input/13 hover:bg-input/30 transition-all duration-300 ease-in-out border-3 items-center justify-center rounded-lg"
|
||||
|
|
|
|||
|
|
@ -7,8 +7,12 @@ import List from "@/features/conversation/list/body";
|
|||
import {
|
||||
Sidebar as SidebarRoot,
|
||||
SidebarContent,
|
||||
SidebarFooter,
|
||||
} from "@tensamin/ui/cmp/sidebar";
|
||||
import { isTauri } from "@tauri-apps/api/core";
|
||||
import { useIsMobile } from "@tensamin/ui/utils";
|
||||
import { MobileNavbar } from "./navbar";
|
||||
import { useLocation } from "@tanstack/react-router";
|
||||
|
||||
/**
|
||||
* Renders the conversation sidebar with account summary and conversation list.
|
||||
|
|
@ -17,14 +21,19 @@ import { isTauri } from "@tauri-apps/api/core";
|
|||
export default function Sidebar() {
|
||||
const [userId, setUserId] = React.useState<undefined | number>(undefined);
|
||||
const { load } = useStorage();
|
||||
const isMobile = useIsMobile();
|
||||
|
||||
React.useEffect(() => {
|
||||
load("user_id").then(setUserId);
|
||||
}, [load]);
|
||||
|
||||
const location = useLocation();
|
||||
|
||||
return (
|
||||
<SidebarRoot>
|
||||
<SidebarContent className={isTauri() ? "pt-[env(safe-area-inset-top)]" : "pt-2"}>
|
||||
<SidebarContent
|
||||
className={isTauri() ? "pt-[env(safe-area-inset-top)]" : "pt-2"}
|
||||
>
|
||||
<div className="h-full w-full flex flex-col gap-3 p-2 pt-0!">
|
||||
<div>
|
||||
<Wrapper
|
||||
|
|
@ -38,6 +47,11 @@ export default function Sidebar() {
|
|||
</div>
|
||||
</div>
|
||||
</SidebarContent>
|
||||
{isMobile && location.pathname === "/chat" && (
|
||||
<SidebarFooter className="p-0!">
|
||||
<MobileNavbar />
|
||||
</SidebarFooter>
|
||||
)}
|
||||
</SidebarRoot>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -18,14 +18,12 @@ export default function List() {
|
|||
>("conversations");
|
||||
|
||||
const { conversations, communities } = useConversation();
|
||||
const items = category === "conversations" ? conversations : communities;
|
||||
|
||||
const scrollRef = React.useRef<HTMLDivElement | null>(null);
|
||||
|
||||
const virtualizer = useVirtualizer({
|
||||
count:
|
||||
category === "conversations"
|
||||
? conversations?.length || 0
|
||||
: communities?.length || 0,
|
||||
count: items?.length || 0,
|
||||
estimateSize: () => 60,
|
||||
getScrollElement: () => scrollRef.current,
|
||||
});
|
||||
|
|
@ -38,7 +36,7 @@ export default function List() {
|
|||
id="conversation-list"
|
||||
className="overflow-y-auto flex-1 h-full"
|
||||
>
|
||||
{communities === null || conversations === null ? (
|
||||
{items === null ? (
|
||||
<div className="flex items-center justify-center pt-5">
|
||||
<p className="text-foreground/45 flex gap-1 items-center justify-center">
|
||||
<Loader2 size={18} className="animate-spin" />
|
||||
|
|
@ -52,8 +50,7 @@ export default function List() {
|
|||
height: `${virtualizer.getTotalSize()}px`,
|
||||
}}
|
||||
>
|
||||
{communities &&
|
||||
conversations &&
|
||||
{items &&
|
||||
virtualizer.getVirtualItems().map((virtualItem) => {
|
||||
const itemKey = `${category}-${virtualItem.index}`;
|
||||
|
||||
|
|
@ -69,12 +66,12 @@ export default function List() {
|
|||
}}
|
||||
>
|
||||
{category === "conversations" ? (
|
||||
conversations[virtualItem.index] ? (
|
||||
conversations?.[virtualItem.index] ? (
|
||||
<ConversationModal
|
||||
userId={conversations[virtualItem.index].user_id}
|
||||
/>
|
||||
) : null
|
||||
) : communities[virtualItem.index] ? (
|
||||
) : communities?.[virtualItem.index] ? (
|
||||
<CommunityModal
|
||||
community={communities[virtualItem.index]}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -162,7 +162,7 @@ export default function Screen(props: { children: React.ReactNode }) {
|
|||
}
|
||||
|
||||
return (
|
||||
<div className="w-full h-full flex items-center justify-center">
|
||||
<div className="w-full h-full flex items-center justify-center py-15">
|
||||
<div className="h-full flex flex-col gap-15 p-10 md:p-40 w-full lg:w-2/3">
|
||||
<h1 className="text-3xl md:text-4xl font-bold">
|
||||
Privacy Policy & ToS
|
||||
|
|
@ -173,11 +173,13 @@ export default function Screen(props: { children: React.ReactNode }) {
|
|||
<div className="w-full h-full flex flex-col items-center justify-center gap-5">
|
||||
<div className="justify-start items-start flex flex-col gap-2">
|
||||
<BigCheckbox
|
||||
id="acceptPP"
|
||||
checked={acceptedPP}
|
||||
onChange={acceptPP}
|
||||
label="I agree to the Privacy Policy"
|
||||
/>
|
||||
<BigCheckbox
|
||||
id="acceptTOS"
|
||||
checked={acceptedTOS}
|
||||
onChange={acceptTOS}
|
||||
label="I agree to the Terms of Service"
|
||||
|
|
@ -225,10 +227,12 @@ function ContinueButton({
|
|||
}
|
||||
|
||||
export function BigCheckbox({
|
||||
id,
|
||||
label,
|
||||
checked,
|
||||
onChange,
|
||||
}: {
|
||||
id: string;
|
||||
label: string;
|
||||
checked: boolean;
|
||||
onChange: (checked: boolean) => void;
|
||||
|
|
@ -236,11 +240,14 @@ export function BigCheckbox({
|
|||
return (
|
||||
<div className="flex items-center space-x-2">
|
||||
<Checkbox
|
||||
id={id}
|
||||
checked={checked}
|
||||
onCheckedChange={onChange}
|
||||
className="size-5.5 rounded-md flex items-center justify-center"
|
||||
/>
|
||||
<Label className="text-lg">{label}</Label>
|
||||
<Label htmlFor={id} className="text-lg">
|
||||
{label}
|
||||
</Label>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,9 +15,12 @@ import { useTTP } from "@tensamin/ttp/context";
|
|||
import { useState } from "react";
|
||||
import { Loader2 } from "lucide-react";
|
||||
import { isTauri } from "@tauri-apps/api/core";
|
||||
import { useStorage } from "@tensamin/storage/context";
|
||||
|
||||
// The page
|
||||
export default function Page() {
|
||||
const { clear } = useStorage();
|
||||
|
||||
return (
|
||||
<div className={`px-3 flex gap-2 ${!isTauri() && "pt-3"}`}>
|
||||
<AddConversationButton />
|
||||
|
|
@ -25,6 +28,12 @@ export default function Page() {
|
|||
<Button variant="outline" onClick={() => location.reload()}>
|
||||
Reload
|
||||
</Button>
|
||||
<Button
|
||||
variant="destructive"
|
||||
onClick={() => clear().then(() => location.reload())}
|
||||
>
|
||||
Logout
|
||||
</Button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,8 +11,8 @@ export default function Page() {
|
|||
<Form />
|
||||
<div className="flex">
|
||||
<a target="_blank" href="https://docs.tensamin.net/installation/#iota">
|
||||
<p className="text-sm underline text-foreground/75">
|
||||
Don't have an account yet? Click here to get help setting up an
|
||||
<p className="text-sm underline text-foreground/75 text-center whitespace-pre-wrap">
|
||||
Don't have an account yet?{"\n"}Click here to get help setting up an
|
||||
Iota.
|
||||
</p>
|
||||
</a>
|
||||
|
|
|
|||
Loading…
Reference in a new issue