From 2e8066df096496be5f9a0ee480a080ab752cd6e4 Mon Sep 17 00:00:00 2001 From: peterpeterparker Date: Wed, 23 Dec 2020 15:31:33 +0100 Subject: [PATCH 1/3] feat: if already signed in, display dashboard not signin options --- studio/src/app/app-root.tsx | 10 ++-- .../core/app-signin/app-signin.scss | 0 .../core/app-signin/app-signin.tsx | 23 ++++---- .../app-dashboard/app-dashboard.scss | 0 .../app-dashboard/app-dashboard.tsx | 11 +--- .../core/app-dashboard/app-dashboard-page.tsx | 17 ++++++ .../pages/core/app-signin/app-signin-page.tsx | 55 +++++++++++++++++++ studio/src/components.d.ts | 26 +++++++++ 8 files changed, 114 insertions(+), 28 deletions(-) rename studio/src/app/{pages => components}/core/app-signin/app-signin.scss (100%) rename studio/src/app/{pages => components}/core/app-signin/app-signin.tsx (94%) rename studio/src/app/{pages/core => components/dashboard}/app-dashboard/app-dashboard.scss (100%) rename studio/src/app/{pages/core => components/dashboard}/app-dashboard/app-dashboard.tsx (98%) create mode 100644 studio/src/app/pages/core/app-dashboard/app-dashboard-page.tsx create mode 100644 studio/src/app/pages/core/app-signin/app-signin-page.tsx 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/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..0236bb8a1 --- /dev/null +++ b/studio/src/app/pages/core/app-signin/app-signin-page.tsx @@ -0,0 +1,55 @@ +import {Component, Fragment, h, 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 { + @State() + private signin: boolean; + + private destroyListener; + + async componentWillLoad() { + this.destroyListener = authStore.onChange('authUser', async (_authUser: AuthUser | null) => { + await this.initSignedIn(); + }); + + 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..af415c6b2 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,8 @@ export namespace Components { "redirect": string; "redirectId": string; } + interface AppSigninPage { + } interface AppSlideNavigate { } interface AppSlidePreview { @@ -550,6 +554,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 +914,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 +1022,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 +1082,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 +1246,8 @@ declare namespace LocalJSX { "onDeckCloned"?: (event: CustomEvent) => void; "onDeckDeleted"?: (event: CustomEvent) => void; } + interface AppDashboardPage { + } interface AppDeckDelete { "deckName"?: string; "published"?: string; @@ -1461,6 +1481,8 @@ declare namespace LocalJSX { "redirect"?: string; "redirectId"?: string; } + interface AppSigninPage { + } interface AppSlideNavigate { "onReorder"?: (event: CustomEvent) => void; } @@ -1527,6 +1549,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 +1609,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 +1657,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 +1717,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; From ded87ac19c9ea10e60cb2914614d4527995a7cbc Mon Sep 17 00:00:00 2001 From: peterpeterparker Date: Wed, 23 Dec 2020 15:51:35 +0100 Subject: [PATCH 2/3] feat: avoid dashboard flickering fix: missing redirect info --- .../pages/core/app-signin/app-signin-page.tsx | 16 ++++++++++++---- studio/src/components.d.ts | 4 ++++ 2 files changed, 16 insertions(+), 4 deletions(-) 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 index 0236bb8a1..6459df4c6 100644 --- a/studio/src/app/pages/core/app-signin/app-signin-page.tsx +++ b/studio/src/app/pages/core/app-signin/app-signin-page.tsx @@ -1,4 +1,4 @@ -import {Component, Fragment, h, State} from '@stencil/core'; +import {Component, Fragment, h, Prop, State} from '@stencil/core'; import {AuthUser} from '../../../models/auth/auth.user'; @@ -8,14 +8,22 @@ import authStore from '../../../stores/auth.store'; 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) => { - await this.initSignedIn(); + this.destroyListener = authStore.onChange('authUser', async (authUser: AuthUser | null) => { + if (!authUser) { + this.signin = true; + } }); await this.initSignedIn(); @@ -37,7 +45,7 @@ export class AppSigninPage { - + ); diff --git a/studio/src/components.d.ts b/studio/src/components.d.ts index af415c6b2..59823ccea 100644 --- a/studio/src/components.d.ts +++ b/studio/src/components.d.ts @@ -344,6 +344,8 @@ export namespace Components { "redirectId": string; } interface AppSigninPage { + "redirect": string; + "redirectId": string; } interface AppSlideNavigate { } @@ -1482,6 +1484,8 @@ declare namespace LocalJSX { "redirectId"?: string; } interface AppSigninPage { + "redirect"?: string; + "redirectId"?: string; } interface AppSlideNavigate { "onReorder"?: (event: CustomEvent) => void; From c78f14de04bb6b325379e79e6c650c86479fd330 Mon Sep 17 00:00:00 2001 From: peterpeterparker Date: Wed, 23 Dec 2020 15:55:11 +0100 Subject: [PATCH 3/3] style: heading sample size and weight --- .../components/editor/app-slot-type/app-slot-type.scss | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) 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,