diff --git a/studio/src/app/app-root.tsx b/studio/src/app/app-root.tsx index 067ed655b..227f103bd 100644 --- a/studio/src/app/app-root.tsx +++ b/studio/src/app/app-root.tsx @@ -176,7 +176,7 @@ export class AppRoot { return [ - + @@ -184,11 +184,11 @@ export class AppRoot { - + - - - + + + diff --git a/studio/src/app/pages/core/app-signin/app-signin.scss b/studio/src/app/components/core/app-signin/app-signin.scss similarity index 100% rename from studio/src/app/pages/core/app-signin/app-signin.scss rename to studio/src/app/components/core/app-signin/app-signin.scss diff --git a/studio/src/app/pages/core/app-signin/app-signin.tsx b/studio/src/app/components/core/app-signin/app-signin.tsx similarity index 94% rename from studio/src/app/pages/core/app-signin/app-signin.tsx rename to studio/src/app/components/core/app-signin/app-signin.tsx index fd9f263cb..942bd8eba 100644 --- a/studio/src/app/pages/core/app-signin/app-signin.tsx +++ b/studio/src/app/components/core/app-signin/app-signin.tsx @@ -217,7 +217,7 @@ export class AppSignIn { let token: string | null = null; if (authStore.state.authUser) { - token = await firebase.auth().currentUser.getIdToken(); + token = await firebase.auth().currentUser?.getIdToken(); } localStorage.setItem( @@ -280,22 +280,19 @@ export class AppSignIn { render() { return [ - , - -
- {this.renderBackButton()} +
+ {this.renderBackButton()} - {this.renderMsg()} + {this.renderMsg()} - {this.renderGitHub()} + {this.renderGitHub()} -
+
-

- DeckDeckGo is free and open source 😃. -

-
- , +

+ DeckDeckGo is free and open source 😃. +

+
, ]; } diff --git a/studio/src/app/pages/core/app-dashboard/app-dashboard.scss b/studio/src/app/components/dashboard/app-dashboard/app-dashboard.scss similarity index 100% rename from studio/src/app/pages/core/app-dashboard/app-dashboard.scss rename to studio/src/app/components/dashboard/app-dashboard/app-dashboard.scss diff --git a/studio/src/app/pages/core/app-dashboard/app-dashboard.tsx b/studio/src/app/components/dashboard/app-dashboard/app-dashboard.tsx similarity index 98% rename from studio/src/app/pages/core/app-dashboard/app-dashboard.tsx rename to studio/src/app/components/dashboard/app-dashboard/app-dashboard.tsx index 61272f79b..1788eefc3 100644 --- a/studio/src/app/pages/core/app-dashboard/app-dashboard.tsx +++ b/studio/src/app/components/dashboard/app-dashboard/app-dashboard.tsx @@ -142,7 +142,7 @@ export class AppDashboard { const promises: Promise[] = []; this.decks.forEach((deck: DeckAndFirstSlide) => { - if (deck.deck?.data?.clone !== undefined) { + if (deck?.deck?.data?.clone !== undefined) { promises.push(this.deckDashboardService.snapshot(deck.deck, this.watchClonedDeck)); } }); @@ -425,15 +425,6 @@ export class AppDashboard { }; render() { - return ( - - - {this.renderContent()} - - ); - } - - private renderContent() { if (this.loading) { return this.renderLoading(); } diff --git a/studio/src/app/components/editor/app-slot-type/app-slot-type.scss b/studio/src/app/components/editor/app-slot-type/app-slot-type.scss index 704367a0d..2f2850077 100644 --- a/studio/src/app/components/editor/app-slot-type/app-slot-type.scss +++ b/studio/src/app/components/editor/app-slot-type/app-slot-type.scss @@ -13,13 +13,16 @@ app-slot-type { ion-list { ion-item { - h1, + h1 { + font-size: 28px; + } + h2 { - font-weight: 400; + font-size: 20px; } h3 { - font-weight: 400; + font-size: 17px; } h1, diff --git a/studio/src/app/pages/core/app-dashboard/app-dashboard-page.tsx b/studio/src/app/pages/core/app-dashboard/app-dashboard-page.tsx new file mode 100644 index 000000000..f722bac05 --- /dev/null +++ b/studio/src/app/pages/core/app-dashboard/app-dashboard-page.tsx @@ -0,0 +1,17 @@ +import {Component, h, Fragment} from '@stencil/core'; + +@Component({ + tag: 'app-dashboard-page', +}) +export class AppDashboardPage { + render() { + return [ + + + + + + , + ]; + } +} diff --git a/studio/src/app/pages/core/app-signin/app-signin-page.tsx b/studio/src/app/pages/core/app-signin/app-signin-page.tsx new file mode 100644 index 000000000..6459df4c6 --- /dev/null +++ b/studio/src/app/pages/core/app-signin/app-signin-page.tsx @@ -0,0 +1,63 @@ +import {Component, Fragment, h, Prop, State} from '@stencil/core'; + +import {AuthUser} from '../../../models/auth/auth.user'; + +import authStore from '../../../stores/auth.store'; + +@Component({ + tag: 'app-signin-page', +}) +export class AppSigninPage { + @Prop() + redirect: string; + + @Prop() + redirectId: string; + + @State() + private signin: boolean; + + private destroyListener; + + async componentWillLoad() { + this.destroyListener = authStore.onChange('authUser', async (authUser: AuthUser | null) => { + if (!authUser) { + this.signin = true; + } + }); + + await this.initSignedIn(); + } + + private async initSignedIn() { + this.signin = authStore.state.authUser === undefined || authStore.state.anonymous; + } + + disconnectedCallback() { + if (this.destroyListener) { + this.destroyListener(); + } + } + + render() { + if (this.signin) { + return ( + + + + + + + ); + } + + return ( + + + + + + + ); + } +} diff --git a/studio/src/components.d.ts b/studio/src/components.d.ts index f3a77a65b..59823ccea 100644 --- a/studio/src/components.d.ts +++ b/studio/src/components.d.ts @@ -134,6 +134,8 @@ export namespace Components { interface AppDashboardDeckActions { "deck": Deck; } + interface AppDashboardPage { + } interface AppDeckDelete { "deckName": string; "published": string; @@ -341,6 +343,10 @@ export namespace Components { "redirect": string; "redirectId": string; } + interface AppSigninPage { + "redirect": string; + "redirectId": string; + } interface AppSlideNavigate { } interface AppSlidePreview { @@ -550,6 +556,12 @@ declare global { prototype: HTMLAppDashboardDeckActionsElement; new (): HTMLAppDashboardDeckActionsElement; }; + interface HTMLAppDashboardPageElement extends Components.AppDashboardPage, HTMLStencilElement { + } + var HTMLAppDashboardPageElement: { + prototype: HTMLAppDashboardPageElement; + new (): HTMLAppDashboardPageElement; + }; interface HTMLAppDeckDeleteElement extends Components.AppDeckDelete, HTMLStencilElement { } var HTMLAppDeckDeleteElement: { @@ -904,6 +916,12 @@ declare global { prototype: HTMLAppSigninElement; new (): HTMLAppSigninElement; }; + interface HTMLAppSigninPageElement extends Components.AppSigninPage, HTMLStencilElement { + } + var HTMLAppSigninPageElement: { + prototype: HTMLAppSigninPageElement; + new (): HTMLAppSigninPageElement; + }; interface HTMLAppSlideNavigateElement extends Components.AppSlideNavigate, HTMLStencilElement { } var HTMLAppSlideNavigateElement: { @@ -1006,6 +1024,7 @@ declare global { "app-customization": HTMLAppCustomizationElement; "app-dashboard": HTMLAppDashboardElement; "app-dashboard-deck-actions": HTMLAppDashboardDeckActionsElement; + "app-dashboard-page": HTMLAppDashboardPageElement; "app-deck-delete": HTMLAppDeckDeleteElement; "app-deck-fonts": HTMLAppDeckFontsElement; "app-deck-header-footer": HTMLAppDeckHeaderFooterElement; @@ -1065,6 +1084,7 @@ declare global { "app-share-deck": HTMLAppShareDeckElement; "app-share-options": HTMLAppShareOptionsElement; "app-signin": HTMLAppSigninElement; + "app-signin-page": HTMLAppSigninPageElement; "app-slide-navigate": HTMLAppSlideNavigateElement; "app-slide-preview": HTMLAppSlidePreviewElement; "app-slide-warning": HTMLAppSlideWarningElement; @@ -1228,6 +1248,8 @@ declare namespace LocalJSX { "onDeckCloned"?: (event: CustomEvent) => void; "onDeckDeleted"?: (event: CustomEvent) => void; } + interface AppDashboardPage { + } interface AppDeckDelete { "deckName"?: string; "published"?: string; @@ -1461,6 +1483,10 @@ declare namespace LocalJSX { "redirect"?: string; "redirectId"?: string; } + interface AppSigninPage { + "redirect"?: string; + "redirectId"?: string; + } interface AppSlideNavigate { "onReorder"?: (event: CustomEvent) => void; } @@ -1527,6 +1553,7 @@ declare namespace LocalJSX { "app-customization": AppCustomization; "app-dashboard": AppDashboard; "app-dashboard-deck-actions": AppDashboardDeckActions; + "app-dashboard-page": AppDashboardPage; "app-deck-delete": AppDeckDelete; "app-deck-fonts": AppDeckFonts; "app-deck-header-footer": AppDeckHeaderFooter; @@ -1586,6 +1613,7 @@ declare namespace LocalJSX { "app-share-deck": AppShareDeck; "app-share-options": AppShareOptions; "app-signin": AppSignin; + "app-signin-page": AppSigninPage; "app-slide-navigate": AppSlideNavigate; "app-slide-preview": AppSlidePreview; "app-slide-warning": AppSlideWarning; @@ -1633,6 +1661,7 @@ declare module "@stencil/core" { "app-customization": LocalJSX.AppCustomization & JSXBase.HTMLAttributes; "app-dashboard": LocalJSX.AppDashboard & JSXBase.HTMLAttributes; "app-dashboard-deck-actions": LocalJSX.AppDashboardDeckActions & JSXBase.HTMLAttributes; + "app-dashboard-page": LocalJSX.AppDashboardPage & JSXBase.HTMLAttributes; "app-deck-delete": LocalJSX.AppDeckDelete & JSXBase.HTMLAttributes; "app-deck-fonts": LocalJSX.AppDeckFonts & JSXBase.HTMLAttributes; "app-deck-header-footer": LocalJSX.AppDeckHeaderFooter & JSXBase.HTMLAttributes; @@ -1692,6 +1721,7 @@ declare module "@stencil/core" { "app-share-deck": LocalJSX.AppShareDeck & JSXBase.HTMLAttributes; "app-share-options": LocalJSX.AppShareOptions & JSXBase.HTMLAttributes; "app-signin": LocalJSX.AppSignin & JSXBase.HTMLAttributes; + "app-signin-page": LocalJSX.AppSigninPage & JSXBase.HTMLAttributes; "app-slide-navigate": LocalJSX.AppSlideNavigate & JSXBase.HTMLAttributes; "app-slide-preview": LocalJSX.AppSlidePreview & JSXBase.HTMLAttributes; "app-slide-warning": LocalJSX.AppSlideWarning & JSXBase.HTMLAttributes;