mirror of
https://github.com/nestriness/nestri.git
synced 2025-12-13 01:05:37 +02:00
⭐ feat(www): Finish up on the onboarding (#210)
Merging this prematurely to make sure the team is on the same boat... like dang! We need to find a better way to do this. Plus it has become too big
This commit is contained in:
@@ -6,13 +6,18 @@ import '@fontsource/geist-sans/600.css';
|
||||
import '@fontsource/geist-sans/700.css';
|
||||
import '@fontsource/geist-sans/800.css';
|
||||
import '@fontsource/geist-sans/900.css';
|
||||
import { Text } from '@nestri/www/ui/text';
|
||||
import { styled } from "@macaron-css/solid";
|
||||
import { useStorage } from './providers/account';
|
||||
import { CreateTeamComponent } from './pages/new';
|
||||
import { darkClass, lightClass, theme } from './ui/theme';
|
||||
import { AuthProvider, useAuth } from './providers/auth';
|
||||
import { Screen as FullScreen } from '@nestri/www/ui/layout';
|
||||
import { TeamRoute } from '@nestri/www/pages/team';
|
||||
import { OpenAuthProvider } from "@openauthjs/solid";
|
||||
import { NotFound } from '@nestri/www/pages/not-found';
|
||||
import { Navigate, Route, Router } from "@solidjs/router";
|
||||
import { globalStyle, macaron$ } from "@macaron-css/core";
|
||||
import { useStorage } from '@nestri/www/providers/account';
|
||||
import { CreateTeamComponent } from '@nestri/www/pages/new';
|
||||
import { darkClass, lightClass, theme } from '@nestri/www/ui/theme';
|
||||
import { AccountProvider, useAccount } from '@nestri/www/providers/account';
|
||||
import { Component, createSignal, Match, onCleanup, Switch } from 'solid-js';
|
||||
|
||||
const Root = styled("div", {
|
||||
@@ -34,14 +39,19 @@ globalStyle("html", {
|
||||
// Hardcode colors
|
||||
"@media": {
|
||||
"(prefers-color-scheme: light)": {
|
||||
backgroundColor: "#f5f5f5",
|
||||
backgroundColor: "rgba(255,255,255,0.8)",
|
||||
},
|
||||
"(prefers-color-scheme: dark)": {
|
||||
backgroundColor: "#1e1e1e",
|
||||
backgroundColor: "rgb(19,21,23)",
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
globalStyle("dialog:modal", {
|
||||
maxHeight: "unset",
|
||||
maxWidth: "unset"
|
||||
})
|
||||
|
||||
globalStyle("h1, h2, h3, h4, h5, h6, p", {
|
||||
margin: 0,
|
||||
});
|
||||
@@ -82,44 +92,54 @@ export const App: Component = () => {
|
||||
const storage = useStorage();
|
||||
|
||||
return (
|
||||
<Root class={theme() === "light" ? lightClass : darkClass} id="styled">
|
||||
<Router>
|
||||
<Route
|
||||
path="*"
|
||||
component={(props) => (
|
||||
<AuthProvider>
|
||||
{props.children}
|
||||
</AuthProvider>
|
||||
// props.children
|
||||
)}
|
||||
>
|
||||
<Route path="new" component={CreateTeamComponent} />
|
||||
<OpenAuthProvider
|
||||
issuer={import.meta.env.VITE_AUTH_URL}
|
||||
clientID="web"
|
||||
>
|
||||
<Root class={theme() === "light" ? lightClass : darkClass} id="styled">
|
||||
<Router>
|
||||
<Route
|
||||
path="/"
|
||||
component={() => {
|
||||
const auth = useAuth();
|
||||
return (
|
||||
<Switch>
|
||||
<Match when={auth.current.teams.length > 0}>
|
||||
<Navigate
|
||||
href={`/${(
|
||||
auth.current.teams.find(
|
||||
(w) => w.id === storage.value.team,
|
||||
) || auth.current.teams[0]
|
||||
).slug
|
||||
}`}
|
||||
/>
|
||||
</Match>
|
||||
<Match when={true}>
|
||||
<Navigate href={`/new`} />
|
||||
</Match>
|
||||
</Switch>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
{/* <Route path="*" component={() => <NotFound />} /> */}
|
||||
</Route>
|
||||
</Router>
|
||||
</Root>
|
||||
path="*"
|
||||
component={(props) => (
|
||||
<AccountProvider
|
||||
loadingUI={
|
||||
<FullScreen>
|
||||
<Text weight='semibold' spacing='xs' size="3xl" font="heading" >Confirming your identity…</Text>
|
||||
</FullScreen>
|
||||
}>
|
||||
{props.children}
|
||||
</AccountProvider>
|
||||
)}
|
||||
>
|
||||
<Route path=":teamSlug">{TeamRoute}</Route>
|
||||
<Route path="new" component={CreateTeamComponent} />
|
||||
<Route
|
||||
path="/"
|
||||
component={() => {
|
||||
const account = useAccount();
|
||||
return (
|
||||
<Switch>
|
||||
<Match when={account.current.teams.length > 0}>
|
||||
<Navigate
|
||||
href={`/${(
|
||||
account.current.teams.find(
|
||||
(w) => w.id === storage.value.team,
|
||||
) || account.current.teams[0]
|
||||
).slug
|
||||
}`}
|
||||
/>
|
||||
</Match>
|
||||
<Match when={true}>
|
||||
<Navigate href={`/new`} />
|
||||
</Match>
|
||||
</Switch>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
<Route path="*" component={() => <NotFound />} />
|
||||
</Route>
|
||||
</Router>
|
||||
</Root>
|
||||
</OpenAuthProvider>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user