From 70347722fa1f959a5b224ed43b6b64bf289f36cf Mon Sep 17 00:00:00 2001 From: ivarlovlie Date: Sun, 2 Oct 2022 17:35:06 +0800 Subject: feat/refactor: Initial surroundings for (app) and normalise icon names --- apps/kit/src/lib/components/alert.svelte | 96 +--- apps/kit/src/lib/components/button.svelte | 19 +- .../lib/components/icons/bars-3-center-left.svelte | 15 + apps/kit/src/lib/components/icons/calendar.svelte | 14 + .../lib/components/icons/chevron-up-down.svelte | 13 + .../src/lib/components/icons/folder-open.svelte | 14 + apps/kit/src/lib/components/icons/index.ts | 42 +- .../lib/components/icons/magnifying-glass.svelte | 13 + apps/kit/src/lib/components/icons/megaphone.svelte | 14 + .../kit/src/lib/components/icons/queue-list.svelte | 14 + apps/kit/src/lib/components/input.svelte | 58 +-- apps/kit/src/lib/components/locale-switcher.svelte | 47 +- apps/kit/src/routes/(main)/(app)/+layout.svelte | 534 +++++++++++---------- apps/kit/src/routes/(main)/(app)/org/+page.svelte | 4 + .../src/routes/(main)/(app)/profile/+page.svelte | 4 + .../src/routes/(main)/(app)/projects/+page.svelte | 4 + .../src/routes/(main)/(app)/settings/+page.svelte | 4 + .../src/routes/(main)/(app)/tickets/+page.svelte | 4 + apps/kit/src/routes/(main)/(app)/todo/+page.svelte | 4 + apps/kit/src/routes/(main)/(app)/wiki/+page.svelte | 4 + apps/kit/src/routes/(main)/+layout.svelte | 26 + 21 files changed, 512 insertions(+), 435 deletions(-) create mode 100644 apps/kit/src/lib/components/icons/bars-3-center-left.svelte create mode 100644 apps/kit/src/lib/components/icons/calendar.svelte create mode 100644 apps/kit/src/lib/components/icons/chevron-up-down.svelte create mode 100644 apps/kit/src/lib/components/icons/folder-open.svelte create mode 100644 apps/kit/src/lib/components/icons/magnifying-glass.svelte create mode 100644 apps/kit/src/lib/components/icons/megaphone.svelte create mode 100644 apps/kit/src/lib/components/icons/queue-list.svelte create mode 100644 apps/kit/src/routes/(main)/(app)/org/+page.svelte create mode 100644 apps/kit/src/routes/(main)/(app)/profile/+page.svelte create mode 100644 apps/kit/src/routes/(main)/(app)/projects/+page.svelte create mode 100644 apps/kit/src/routes/(main)/(app)/settings/+page.svelte create mode 100644 apps/kit/src/routes/(main)/(app)/tickets/+page.svelte create mode 100644 apps/kit/src/routes/(main)/(app)/todo/+page.svelte create mode 100644 apps/kit/src/routes/(main)/(app)/wiki/+page.svelte diff --git a/apps/kit/src/lib/components/alert.svelte b/apps/kit/src/lib/components/alert.svelte index fa36a63..31e7357 100644 --- a/apps/kit/src/lib/components/alert.svelte +++ b/apps/kit/src/lib/components/alert.svelte @@ -3,13 +3,7 @@ import { createEventDispatcher } from "svelte"; import { onMount } from "svelte"; import { Temporal } from "temporal-polyfill"; - import { - ExclamationTriangle, - CheckCircle, - InformationCircle, - XCircle, - XMark, - } from "./icons"; + import { ExclamationTriangleIcon, CheckCircleIcon, InformationCircleIcon, XCircleIcon, XMarkIcon } from "./icons"; const dispatch = createEventDispatcher(); const noCooldownSetting = "no-cooldown"; @@ -58,46 +52,40 @@ * Text is the button text * Color is the optional tailwind color to used, the value is used in classes like bg-$color-50. */ - export let actions: Array<{ id: string; text: string; color?: string }> = - []; + export let actions: Array<{ id: string; text: string; color?: string }> = []; /** * This value is set on a plain anchor tag without any svelte routing, * listen to the on:rightLinkClick if you want to intercept the click without navigating */ export let rightLinkHref = "javascript:void(0)"; $: cooldownEnabled = - id.indexOf(noCooldownSetting) === -1 && - closeable && - (closeableCooldown === "~" || parseInt(closeableCooldown) > 0); + id.indexOf(noCooldownSetting) === -1 && closeable && (closeableCooldown === "~" || parseInt(closeableCooldown) > 0); /** * Sets this alerts visibility state, when this is false it is removed from the dom using svelte a {#if} block. */ - export let visible = - closeableCooldown === "~" || parseInt(closeableCooldown) > 0 - ? false - : true; + export let visible = closeableCooldown === "~" || parseInt(closeableCooldown) > 0 ? false : true; const cooldownStorageKey = "lastseen--" + id; $: switch (type) { case "info": { colorClassPart = "blue"; - iconComponent = InformationCircle; + iconComponent = InformationCircleIcon; break; } case "warning": { colorClassPart = "yellow"; - iconComponent = ExclamationTriangle; + iconComponent = ExclamationTriangleIcon; break; } case "error": { colorClassPart = "red"; - iconComponent = XCircle; + iconComponent = XCircleIcon; break; } case "success": { colorClassPart = "green"; - iconComponent = CheckCircle; + iconComponent = CheckCircleIcon; break; } } @@ -105,15 +93,8 @@ function close() { visible = false; if (cooldownEnabled) { - console.log( - "Cooldown enabled for " + id + ", " + closeableCooldown === "~" - ? "with an endless cooldown" - : "" - ); - localStorage.setItem( - cooldownStorageKey, - String(Temporal.Now.instant().epochSeconds) - ); + console.log("Cooldown enabled for " + id + ", " + closeableCooldown === "~" ? "with an endless cooldown" : ""); + localStorage.setItem(cooldownStorageKey, String(Temporal.Now.instant().epochSeconds)); } } @@ -148,15 +129,8 @@ return; } - const lastSeen = Temporal.Instant.fromEpochSeconds( - parseInt(localStorage.getItem(cooldownStorageKey) ?? "-1") - ); - if ( - Temporal.Instant.compare( - Temporal.Now.instant(), - lastSeen.add({ seconds: parseInt(closeableCooldown) }) - ) === 1 - ) { + const lastSeen = Temporal.Instant.fromEpochSeconds(parseInt(localStorage.getItem(cooldownStorageKey) ?? "-1")); + if (Temporal.Instant.compare(Temporal.Now.instant(), lastSeen.add({ seconds: parseInt(closeableCooldown) })) === 1) { console.log( "Alert " + id + @@ -177,31 +151,19 @@ run_cooldown(); } - if ( - closeable && - closeableCooldown && - id.indexOf(noCooldownSetting) !== -1 - ) { + if (closeable && closeableCooldown && id.indexOf(noCooldownSetting) !== -1) { // TODO: This prints twice before shutting up as it should, in this example look at the only alert with closeableCooldown in alertsbook. // Looks like svelte mounts three times and that my id is only set on the third. Not sure it does at all after logging the id onMount. - console.error( - "Alert cooldown does not work without specifying a unique id, related id: " + - id - ); + console.error("Alert cooldown does not work without specifying a unique id, related id: " + id); } }); {#if visible} -
+
- +
{#if !rightLinkText} @@ -211,20 +173,14 @@ {/if} {#if message} -
+

{@html message}

{/if} {#if listItems?.length ?? 0} -
    +
      {#each listItems as listItem}
    • {listItem}
      • {/each} @@ -234,27 +190,19 @@
      {#if title} -

      +

      {title}

      {/if} {#if message} -
      +

      {@html message}

      {/if} {#if listItems?.length ?? 0} -
        +
          {#each listItems as listItem}
        • {listItem}
          • {/each} @@ -307,7 +255,7 @@ class="inline-flex rounded-md bg-{colorClassPart}-50 p-1.5 text-{colorClassPart}-500 hover:bg-{colorClassPart}-100 focus:outline-none focus:ring-2 focus:ring-{colorClassPart}-600 focus:ring-offset-2 focus:ring-offset-{colorClassPart}-50" > Dismiss - +
      diff --git a/apps/kit/src/lib/components/button.svelte b/apps/kit/src/lib/components/button.svelte index 323c7ad..d345b37 100644 --- a/apps/kit/src/lib/components/button.svelte +++ b/apps/kit/src/lib/components/button.svelte @@ -4,7 +4,7 @@ - -
        - {#each locales as l} + {#each locales as aLocale}
        • {/each} diff --git a/apps/kit/src/routes/(main)/(app)/+layout.svelte b/apps/kit/src/routes/(main)/(app)/+layout.svelte index b69341c..6660c53 100644 --- a/apps/kit/src/routes/(main)/(app)/+layout.svelte +++ b/apps/kit/src/routes/(main)/(app)/+layout.svelte @@ -1,283 +1,297 @@ - -{#if !online} -
        -
        -
        - -
        -
        -

        - You seem to be offline, please check your internet - connection. -

        -
        -
        -
        -{/if} -
        - - (sidebarIsOpen = !sidebarIsOpen)} +
        + + + (sidebarOpen = false)}> + +
        + + +
        + + -
        - - -
        - +
        -
        -         + + + +
        +         +         - -