vrr/supermemory
2
0
Fork 0
mirror of https://github.com/supermemoryai/supermemory.git synced 2026-05-08 18:30:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor /home

Browse source
This commit is contained in:
codetorso 2024-07-18 16:33:17 +05:30
parent 67467e23e2
commit a6be88deab
3 changed files with 62 additions and 57 deletions
Download patch file Download diff file Expand all files Collapse all files

48
apps/web/app/(dash)/home/heading.tsx Normal file
View file

@ -0,0 +1,48 @@
import { useEffect, useState } from "react";
import { headings } from "./headingVariants";
import { motion } from "framer-motion";
const slap = {
initial: {
opacity: 0,
scale: 1.1,
},
whileInView: { opacity: 1, scale: 1 },
transition: {
duration: 0.5,
ease: "easeInOut",
},
viewport: { once: true },
};
export function Heading() {
const [showHeading, setShowHeading] = useState<number>(0);
useEffect(()=> {
setShowHeading(Math.floor(Math.random() * headings.length));
})
return (
<motion.h1
{...{
...slap,
transition: { ...slap.transition, delay: 0.2 },
}}
className="text-center mx-auto bg-[linear-gradient(180deg,_#FFF_0%,_rgba(255,_255,_255,_0.00)_202.08%)] bg-clip-text text-4xl tracking-tighter text-transparent md:text-5xl"
>
{headings[showHeading]!.map((v, i) => {
return (
<span
key={i}
className={
v.type === "highlighted"
? "bg-gradient-to-r to-blue-200 from-zinc-300 text-transparent bg-clip-text"
: ""
}
>
{v.content}
</span>
);
})}
</motion.h1>
);
}

2
apps/web/app/(dash)/home/homeVariants.ts → apps/web/app/(dash)/home/headingVariants.ts
View file

@ -1,4 +1,4 @@
export const variants = [
export const headings = [
[
{
type: "text",

69
apps/web/app/(dash)/home/page.tsx
View file

@ -6,20 +6,16 @@ import { getSessionAuthToken, getSpaces } from "@/app/actions/fetchers";
import { useRouter } from "next/navigation";
import { createChatThread, linkTelegramToUser } from "@/app/actions/doers";
import { toast } from "sonner";
import { motion } from "framer-motion";
import { variants } from "./homeVariants";
import { Heading } from "./heading";
const slap = {
initial: {
opacity: 0,
scale: 1.1,
},
whileInView: { opacity: 1, scale: 1 },
transition: {
duration: 0.5,
ease: "easeInOut",
},
viewport: { once: true },
const linkTelegram = async (telegramUser: string) => {
const response = await linkTelegramToUser(telegramUser);
if (response.success) {
toast.success("Your telegram has been linked successfully.");
} else {
toast.error("Failed to link telegram. Please try again.");
}
};
function Page({
@ -27,9 +23,6 @@ function Page({
}: {
searchParams: Record<string, string | string[] | undefined>;
}) {
// TODO: use this to show a welcome page/modal
// const { firstTime } = homeSearchParamsCache.parse(searchParams);
const [telegramUser, setTelegramUser] = useState<string | undefined>(
searchParams.telegramUser as string,
);
@ -41,27 +34,18 @@ function Page({
const [spaces, setSpaces] = useState<{ id: number; name: string }[]>([]);
const [showVariant, setShowVariant] = useState<number>(0);
useEffect(() => {
// telegram bot
if (telegramUser) {
const linkTelegram = async () => {
const response = await linkTelegramToUser(telegramUser);
if (response.success) {
toast.success("Your telegram has been linked successfully.");
} else {
toast.error("Failed to link telegram. Please try again.");
}
};
linkTelegram();
linkTelegram(telegramUser);
}
if (extensionInstalled) {
toast.success("Extension installed successfully");
}
// fetch spaces
getSpaces().then((res) => {
if (res.success && res.data) {
setSpaces(res.data);
@ -70,8 +54,6 @@ function Page({
// TODO: HANDLE ERROR
});
setShowVariant(Math.floor(Math.random() * variants.length));
getSessionAuthToken().then((token) => {
if (typeof window === "undefined") return;
window.postMessage({ token: token.data }, "*");
@ -80,32 +62,7 @@ function Page({
return (
<div className="max-w-3xl h-full justify-center flex mx-auto w-full flex-col px-2 md:px-0">
{/* all content goes here */}
{/* <div className="">hi {firstTime ? 'first time' : ''}</div> */}
<motion.h1
{...{
...slap,
transition: { ...slap.transition, delay: 0.2 },
}}
className="text-center mx-auto bg-[linear-gradient(180deg,_#FFF_0%,_rgba(255,_255,_255,_0.00)_202.08%)] bg-clip-text text-4xl tracking-tighter text-transparent md:text-5xl"
>
{variants[showVariant]!.map((v, i) => {
return (
<span
key={i}
className={
v.type === "highlighted"
? "bg-gradient-to-r to-blue-200 from-zinc-300 text-transparent bg-clip-text"
: ""
}
>
{v.content}
</span>
);
})}
</motion.h1>
<Heading />
<div className="w-full pb-20 mt-12">
<QueryInput
handleSubmit={async (q, spaces) => {