From 7ba5b0c2325ce3d2782819d688c2116a78ca97ca Mon Sep 17 00:00:00 2001 From: Henri Larget <1727893+decima@users.noreply.github.com> Date: Mon, 26 Dec 2022 11:36:25 +0100 Subject: [PATCH] feat(frontend): improvements (#8) + better responsive theme + new list of files with images + filters on lists --- NotionSlider.go | 13 +-- app/src/App.svelte | 2 +- app/src/lib/Navbar.svelte | 2 +- app/src/lib/notionComponent/Image.svelte | 4 - app/src/lib/pages/ListSlides.svelte | 81 ++++++++++++----- app/src/lib/pages/Presentation.svelte | 106 ++++++++++++----------- app/src/lib/stores/api.js | 3 + 7 files changed, 126 insertions(+), 85 deletions(-) diff --git a/NotionSlider.go b/NotionSlider.go index b00168f..636e1c7 100644 --- a/NotionSlider.go +++ b/NotionSlider.go @@ -195,8 +195,10 @@ func searchInDatabase(client *notionapi.Client, id notionapi.DatabaseID) []notio } type Document struct { - Name string `json:"name"` - URL string `json:"url"` + Name string `json:"name"` + URL string `json:"url"` + Cover *notionapi.Image `json:"cover"` + Page *notionapi.Page `json:"page"` } func listFiles(client *notionapi.Client) map[string]Document { @@ -219,7 +221,6 @@ func listFiles(client *notionapi.Client) map[string]Document { for _, i := range res.Results { page := i.(*notionapi.Page) pageTitle := "~" - var prop notionapi.Property if nameProperty, ok := page.Properties["Name"]; ok { @@ -237,8 +238,10 @@ func listFiles(client *notionapi.Client) map[string]Document { } pages[string(page.ID)] = Document{ - Name: pageTitle, - URL: page.URL, + Name: pageTitle, + URL: page.URL, + Cover: page.Cover, + Page: page, } } diff --git a/app/src/App.svelte b/app/src/App.svelte index ee32721..91be9b3 100644 --- a/app/src/App.svelte +++ b/app/src/App.svelte @@ -14,7 +14,7 @@ -
+
diff --git a/app/src/lib/Navbar.svelte b/app/src/lib/Navbar.svelte index 729b3d6..30c10fd 100644 --- a/app/src/lib/Navbar.svelte +++ b/app/src/lib/Navbar.svelte @@ -18,7 +18,7 @@ {#if !$location.pathname.startsWith("/slides/") && !$location.pathname.startsWith("/database/") && !$location.pathname.startsWith("/presentation/") } -
+
Notion Slider 
{$globalSettings.version}
diff --git a/app/src/lib/notionComponent/Image.svelte b/app/src/lib/notionComponent/Image.svelte index 9a8a2bb..a6381da 100644 --- a/app/src/lib/notionComponent/Image.svelte +++ b/app/src/lib/notionComponent/Image.svelte @@ -2,10 +2,6 @@ import RichText from "../notionPrimaries/RichText.svelte"; export let item - - function toJSON(obj) { - return JSON.stringify(obj) - }
diff --git a/app/src/lib/pages/ListSlides.svelte b/app/src/lib/pages/ListSlides.svelte index ab6e96f..f87302a 100644 --- a/app/src/lib/pages/ListSlides.svelte +++ b/app/src/lib/pages/ListSlides.svelte @@ -1,33 +1,68 @@ -
- - - +
+
+ + { elements.length } results +
+
{#if data} - {#each Object.entries(data).sort((a, b) => a[1].name.localeCompare(b[1].name)) as [slideId, slide]} -
- - - - - - {/each} - {/if} - - -
{slide.name} - - - - -
-
\ No newline at end of file + + {#each elements as [slideId, slide]} +
+
+ +
+ {#if !slide.cover} +
{slide.name.slice(0, 2)}
+ {/if} +
+
+
+

+ {slide.name} +

+
+ {#each slide.page.properties?.slideSettings?.multi_select || [] as tag } +
{searchTerm = tag.name}}>{tag.name}
+ {/each} +
+
+
+ + + +

+ + + + +
+ + +
+ {/each} + {/if} +
+ +
diff --git a/app/src/lib/pages/Presentation.svelte b/app/src/lib/pages/Presentation.svelte index 3f2b35a..4b918c1 100644 --- a/app/src/lib/pages/Presentation.svelte +++ b/app/src/lib/pages/Presentation.svelte @@ -131,58 +131,62 @@ -
- {#if !$slide.loading} - {#if $slide.settings.showFirst} -
-
- {#if $slide.settings.backgroundShadow} -
- {/if} -
-
- - {#if $slide.page.icon && $slide.settings.showIcon} -
- -
- {/if} - {#if $slide.settings.showTitle} -

- {#if $slide?.page?.properties?.Name} - - {:else if $slide?.page?.properties?.title} - - {/if} -

- {/if} -
+
+
+ {#if !$slide.loading} + {#if $slide.settings.showFirst} +
+
+ {#if $slide.settings.backgroundShadow} +
+ {/if} +
+
+ + {#if $slide.page.icon && $slide.settings.showIcon} +
+ +
+ {/if} + {#if $slide.settings.showTitle} +

+ {#if $slide?.page?.properties?.Name} + + {:else if $slide?.page?.properties?.title} + + {/if} +

+ {/if} +
+
-
-
- {/if } - {#each $slide.sections as section,slide} -
- {#each section as item} -
- -
- {/each} -
- {/each} - {:else} - - loading... it may takes several minutes depending of the length of your document and the speed of notion API. - - {#if loadingError} -

- An error occurred during loading from notion, try to refresh 💪. If the problem persist, contact me ✉️. -

+ + {/if } + {#each $slide.sections as section,slide} +
+ {#each section as item} +
+ +
+ {/each} +
+ {/each} + {:else} + + loading... it may takes several minutes depending of the length of your document and the speed of notion + API. + + {#if loadingError} +

+ An error occurred during loading from notion, try to refresh 💪. If the problem persist, contact me + ✉️. +

+ {/if} {/if} - {/if} +
\ No newline at end of file diff --git a/app/src/lib/stores/api.js b/app/src/lib/stores/api.js index 9be04ae..a78626b 100644 --- a/app/src/lib/stores/api.js +++ b/app/src/lib/stores/api.js @@ -37,6 +37,9 @@ export async function getDatabase(id) { } export function resolveImage(obj) { + if (!obj){ + return "no-preview"; + } const item = obj?.external || obj?.file return item?.url