diff --git a/apps/engine/package.json b/apps/engine/package.json index e79f4fa2..d6f37581 100644 --- a/apps/engine/package.json +++ b/apps/engine/package.json @@ -13,6 +13,9 @@ }, "prettier": "@ds-project/prettier", "dependencies": { + "@dicebear/collection": "^9.2.2", + "@dicebear/converter": "^9.2.2", + "@dicebear/core": "^9.2.2", "@ds-project/api": "workspace:*", "@ds-project/auth": "workspace:*", "@ds-project/components": "workspace:*", @@ -29,6 +32,7 @@ "@tanstack/react-query": "^5.51.24", "@trpc/react-query": "catalog:", "@trpc/server": "catalog:", + "@vercel/flags": "^2.6.0", "@vercel/kv": "^2.0.0", "@vercel/og": "^0.6.2", "clsx": "^2.1.1", diff --git a/apps/engine/src/app/app/integrations/layout.tsx b/apps/engine/src/app/app/integrations/layout.tsx index fa7baea4..a7562903 100644 --- a/apps/engine/src/app/app/integrations/layout.tsx +++ b/apps/engine/src/app/app/integrations/layout.tsx @@ -33,7 +33,7 @@ export default function Layout({ Outputs - + Notifications diff --git a/apps/engine/src/app/app/layout.tsx b/apps/engine/src/app/app/layout.tsx index b646fedf..3175fc5b 100644 --- a/apps/engine/src/app/app/layout.tsx +++ b/apps/engine/src/app/app/layout.tsx @@ -1,6 +1,7 @@ import { AppNavigation } from '@/components'; import { api } from '@ds-project/api/rsc'; import { getMetadata } from '@/lib/metadata'; +import { getShowReleasesFlag } from '@/lib/flags'; export const metadata = getMetadata({ title: 'Dashboard' }); @@ -11,6 +12,7 @@ export default async function RootLayout({ }>) { const projects = await api.projects.getAll(); const user = await api.users.getCurrent(); + const showReleases = await getShowReleasesFlag(); return ( <> @@ -19,9 +21,10 @@ export default async function RootLayout({ className="px-2 pt-2" projects={projects} email={user.email} + showReleases={showReleases} /> -
+
{children}
diff --git a/apps/engine/src/app/app/page.tsx b/apps/engine/src/app/app/page.tsx index ee90feaf..234f365a 100644 --- a/apps/engine/src/app/app/page.tsx +++ b/apps/engine/src/app/app/page.tsx @@ -1,5 +1,71 @@ -import { redirect } from 'next/navigation'; +import { MainContent } from '@/components'; +import { config } from '@/config'; +import { + Accordion, + AccordionContent, + AccordionItem, + AccordionTrigger, +} from '@ds-project/components'; +import Link from 'next/link'; + +const items = [ + { + title: 'Who am I?', + content: ( +

+ Hello! I'm Tomás, the builder of DS Pro. I'm glad you're here. +
+ Reach out to me at{' '} + + {config.supportEmail} + {' '} + or join our Discord. +

+ ), + }, + { + title: 'What is DS Pro about?', + content: ( +

+ DS Pro is an open source solution to build Design Systems in an easier + and faster way. +
+ Think of it as an infrastructure provider that allows designers and + developers to connect and run all the pieces of a design system + together. +

+ ), + }, + { + title: 'What can I do with DS Pro?', + content: ( +

+ Currently, DS Pro allows to synchronize your Design Tokens from Figma to + your code repository in GitHub. +
+ More integrations are coming soon. Any feedback or suggestions in our{' '} + feedback board is highly welcome. +

+ ), + }, +]; export default function Home() { - return redirect('/app/integrations'); + return ( + +
+ + {items.map((item, index) => ( + + {item.title} + {item.content} + + ))} + +
+ + ); } diff --git a/apps/engine/src/app/app/tokens/_actions/fetch-release-tokens.action.ts b/apps/engine/src/app/app/releases/_actions/fetch-release-tokens.action.ts similarity index 100% rename from apps/engine/src/app/app/tokens/_actions/fetch-release-tokens.action.ts rename to apps/engine/src/app/app/releases/_actions/fetch-release-tokens.action.ts diff --git a/apps/engine/src/app/app/tokens/_actions/fetch-releases.action.ts b/apps/engine/src/app/app/releases/_actions/fetch-releases.action.ts similarity index 100% rename from apps/engine/src/app/app/tokens/_actions/fetch-releases.action.ts rename to apps/engine/src/app/app/releases/_actions/fetch-releases.action.ts diff --git a/apps/engine/src/app/app/tokens/_actions/index.ts b/apps/engine/src/app/app/releases/_actions/index.ts similarity index 100% rename from apps/engine/src/app/app/tokens/_actions/index.ts rename to apps/engine/src/app/app/releases/_actions/index.ts diff --git a/apps/engine/src/app/app/tokens/_components/index.ts b/apps/engine/src/app/app/releases/_components/index.ts similarity index 100% rename from apps/engine/src/app/app/tokens/_components/index.ts rename to apps/engine/src/app/app/releases/_components/index.ts diff --git a/apps/engine/src/app/app/tokens/_components/select-releases.tsx b/apps/engine/src/app/app/releases/_components/select-releases.tsx similarity index 100% rename from apps/engine/src/app/app/tokens/_components/select-releases.tsx rename to apps/engine/src/app/app/releases/_components/select-releases.tsx diff --git a/apps/engine/src/app/app/releases/page.tsx b/apps/engine/src/app/app/releases/page.tsx new file mode 100644 index 00000000..1ad2d2eb --- /dev/null +++ b/apps/engine/src/app/app/releases/page.tsx @@ -0,0 +1,30 @@ +import { MainContent } from '@/components'; +import { fetchReleases } from './_actions'; +import { SelectReleases } from './_components'; +import { getMetadata } from '@/lib/metadata'; +import { Text } from '@ds-project/components'; + +export const metadata = getMetadata({ title: 'Tokens' }); + +export default async function Tokens() { + const releases = await fetchReleases(); + + return ( + + {(releases?.length ?? 0) > 0 ? ( +
+ +
+ ) : ( + +

+ No releases yet. Connect an input and an output to create a release. +

+ + )} + + ); +} diff --git a/apps/engine/src/app/app/tokens/page.tsx b/apps/engine/src/app/app/tokens/page.tsx deleted file mode 100644 index 99e10d3a..00000000 --- a/apps/engine/src/app/app/tokens/page.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import { JsonBlock, MainContent } from '@/components'; -import { fetchReleases } from './_actions'; -import { SelectReleases } from './_components'; -import { getMetadata } from '@/lib/metadata'; -import { api } from '@ds-project/api/rsc'; - -export const metadata = getMetadata({ title: 'Tokens' }); - -export default async function Tokens() { - const allProjects = await api.projects.getAll(); - const releases = await fetchReleases(); - - return ( - -
- -
- - - ); -} diff --git a/apps/engine/src/app/layout.tsx b/apps/engine/src/app/layout.tsx index 472039c1..31f99d04 100644 --- a/apps/engine/src/app/layout.tsx +++ b/apps/engine/src/app/layout.tsx @@ -36,7 +36,7 @@ export default function RootLayout({ diff --git a/apps/engine/src/components/account-menu/acocunt-menu.tsx b/apps/engine/src/components/account-menu/acocunt-menu.tsx index 55ad4897..139a9d01 100644 --- a/apps/engine/src/components/account-menu/acocunt-menu.tsx +++ b/apps/engine/src/components/account-menu/acocunt-menu.tsx @@ -1,6 +1,11 @@ 'use client'; +import { shapes } from '@dicebear/collection'; +import { createAvatar } from '@dicebear/core'; import { + Avatar, + AvatarFallback, + AvatarImage, Button, DropdownMenu, DropdownMenuContent, @@ -12,23 +17,42 @@ import { Text, } from '@ds-project/components'; import Link from 'next/link'; +import { useMemo } from 'react'; interface AccountMenuProps { email: string; } export function AccountMenu({ email }: AccountMenuProps) { + const avatarUri = useMemo(() => { + const avatar = createAvatar(shapes, { + seed: email, + }); + + return avatar.toDataUri(); + }, [email]); + return ( - My Account + + + {email} + + diff --git a/apps/engine/src/components/app-navigation/app-navigation.tsx b/apps/engine/src/components/app-navigation/app-navigation.tsx index bbdda399..5c993a3f 100644 --- a/apps/engine/src/components/app-navigation/app-navigation.tsx +++ b/apps/engine/src/components/app-navigation/app-navigation.tsx @@ -22,17 +22,19 @@ interface AppNavigationProps { className?: string; projects?: Pick[]; email: string; + showReleases?: boolean; } export function AppNavigation({ className, projects, email, + showReleases, }: AppNavigationProps) { return (