From cf670b3b4cdeeb54c5c23792ffc0a337dfb446bb Mon Sep 17 00:00:00 2001
From: venashial <venashial.levo@aleeas.com>
Date: Wed, 3 Aug 2022 00:52:34 -0700
Subject: [PATCH] Fix errors

---
 theseus_gui/src/components/ProjectCard.svelte |  3 +-
 theseus_gui/src/layout/Sidebar.svelte         | 84 ++++++++++---------
 theseus_gui/src/layout/StatusBar.svelte       |  1 -
 theseus_gui/src/lib/number.ts                 | 40 +++++++++
 theseus_gui/vite.config.js                    |  3 +-
 5 files changed, 88 insertions(+), 43 deletions(-)
 create mode 100644 theseus_gui/src/lib/number.ts

diff --git a/theseus_gui/src/components/ProjectCard.svelte b/theseus_gui/src/components/ProjectCard.svelte
index 03b376f26..7b5626e81 100644
--- a/theseus_gui/src/components/ProjectCard.svelte
+++ b/theseus_gui/src/components/ProjectCard.svelte
@@ -3,7 +3,8 @@
   import IconHeart from 'virtual:icons/lucide/heart';
   import IconDownload from 'virtual:icons/heroicons-outline/download';
   import IconCalendar from 'virtual:icons/lucide/calendar';
-  import { ago, simplify } from 'omorphia/utils';
+  import { ago } from 'omorphia/utils';
+  import { simplify } from '$lib/number';
   import { Avatar, Button } from 'omorphia';
   import { tagIcons } from '$generated/tags.json';
 
diff --git a/theseus_gui/src/layout/Sidebar.svelte b/theseus_gui/src/layout/Sidebar.svelte
index bb5aceffb..a8353fc34 100644
--- a/theseus_gui/src/layout/Sidebar.svelte
+++ b/theseus_gui/src/layout/Sidebar.svelte
@@ -128,53 +128,57 @@
         align-items: center;
         grid-gap: 8px;
 
-            &__title {
-                text-transform: uppercase;
-                letter-spacing: 1px;
-                font-size: 11px;
-                line-height: 100%;
-            }
-
-            &__container {
-                max-height: calc(100vh - 400px);
-                overflow-y: auto;
-                mask-image: linear-gradient(to bottom, transparent, hsla(0, 0%, 0%, 1) 5% 95%, transparent);
-                scrollbar-width: none;
-                padding: 8px 0;
-                display: flex;
-                flex-direction: column;
-                gap: 4px;
-
-                &::-webkit-scrollbar {
-                    display: none;
-                }
-            }
-
-            &__create {
-                margin-top: 16px;
-                display: flex;
-                align-items: center;
-                grid-gap: 8px;
-
-                :global(button) {
-                    width: 32px;
-                }
-            }
+        &__title {
+          text-transform: uppercase;
+          letter-spacing: 1px;
+          font-size: 11px;
+          line-height: 100%;
         }
 
-        > :global(*) {
-            margin-bottom: 24px;
+        &__container {
+          max-height: calc(100vh - 400px);
+          overflow-y: auto;
+          mask-image: linear-gradient(
+            to bottom,
+            transparent,
+            hsla(0, 0%, 0%, 1) 5% 95%,
+            transparent
+          );
+          scrollbar-width: none;
+          padding: 8px 0;
+          display: flex;
+          flex-direction: column;
+          gap: 4px;
+
+          &::-webkit-scrollbar {
+            display: none;
+          }
         }
 
-        > *:last-child {
-            margin-top: auto;
-            margin-bottom: 0;
-        }
+        &__create {
+          margin-top: 16px;
+          display: flex;
+          align-items: center;
+          grid-gap: 8px;
 
-        :global(button) {
-          width: 34px;
+          :global(button) {
+            width: 32px;
+          }
         }
       }
+
+      > :global(*) {
+        margin-bottom: 24px;
+      }
+
+      > *:last-child {
+        margin-top: auto;
+        margin-bottom: 0;
+      }
+
+      :global(button) {
+        width: 34px;
+      }
     }
 
     > :global(*) {
diff --git a/theseus_gui/src/layout/StatusBar.svelte b/theseus_gui/src/layout/StatusBar.svelte
index 5fc722d30..d0b28ac8d 100644
--- a/theseus_gui/src/layout/StatusBar.svelte
+++ b/theseus_gui/src/layout/StatusBar.svelte
@@ -75,7 +75,6 @@
         color: var(--color-text-lightest);
       }
     }
-  }
 
     .statuses {
       margin-left: auto;
diff --git a/theseus_gui/src/lib/number.ts b/theseus_gui/src/lib/number.ts
new file mode 100644
index 000000000..2e775440e
--- /dev/null
+++ b/theseus_gui/src/lib/number.ts
@@ -0,0 +1,40 @@
+/**
+ * Convert large numbers to human readable strings
+ * @source https://github.com/rohmanhm/simplify-number
+ */
+export function simplify(num = 0): string {
+  let numberVar = num;
+
+  // 2 decimal places => 100, 3 => 1000, etc
+  const decPlaces = Math.pow(10, 1);
+
+  // Enumerate number abbreviations
+  const abbrev = ['K', 'M', 'B', 'T'];
+
+  // Go through the array backwards, so we do the largest first
+  for (let i = abbrev.length - 1; i >= 0; i--) {
+    // Convert array index to "1000", "1000000", etc
+    const size = Math.pow(10, (i + 1) * 3);
+
+    // If the number is bigger or equal do the abbreviation
+    if (size <= numberVar) {
+      // Here, we multiply by decPlaces, round, and then divide by decPlaces.
+      // This gives us nice rounding to a particular decimal place.
+      numberVar = Math.round((numberVar * decPlaces) / size) / decPlaces;
+
+      // Handle special case where we round up to the next abbreviation
+      if (numberVar === 1000 && i < abbrev.length - 1) {
+        numberVar = 1;
+        i++;
+      }
+
+      // Add the letter for the abbreviation
+      (numberVar as any) += abbrev[i];
+
+      // We are done... stop
+      break;
+    }
+  }
+
+  return String(numberVar);
+}
diff --git a/theseus_gui/vite.config.js b/theseus_gui/vite.config.js
index c8fac45ce..ccf13da64 100644
--- a/theseus_gui/vite.config.js
+++ b/theseus_gui/vite.config.js
@@ -12,7 +12,8 @@ const config = {
     precompileIntl('locales'),
     Generator({
       gameVersions: true,
-      openapi: true
+      openapi: true,
+      tags: true
     })
   ],
   optimizeDeps: {