fix: cleanup document ref and rel managers and more

Signed-off-by: Alexander Trost <[email protected]>
fivenet-app · Feb 4, 2025 · 5d9a1e0 · 5d9a1e0
1 parent fe5439f
commit 5d9a1e0
Show file tree

Hide file tree

Showing 20 changed files with 690 additions and 747 deletions.
diff --git a/app/app.config.ts b/app/app.config.ts
@@ -1,6 +1,7 @@
 import type { DiscordConfig, FeatureGates, GameConfig, LoginConfig, WebsiteConfig } from '~/typings';
 
 export default defineAppConfig({
+    // BEGIN Server provided App Config
     version: '',
 
     defaultLocale: 'en',
@@ -21,6 +22,7 @@ export default defineAppConfig({
         unemployedJobName: 'unemployed',
         startJobGrade: 0,
     } as GameConfig,
+    // END Server provided App Config
 
     // File upload related config
     fileUpload: {

diff --git a/app/app.vue b/app/app.vue
@@ -46,13 +46,13 @@ if (APP_VERSION !== settings.version) {
 }
 
 // Set locale and theme colors in app config
-appConfig.ui.primary = design.value.ui.primary;
-appConfig.ui.gray = design.value.ui.gray;
-setTabletColors(appConfig.ui.primary, appConfig.ui.gray);
-
-const onBeforeEnter = async () => {
-    await finalizePendingLocaleChange();
-};
+async function setThemeColors(): Promise<void> {
+    appConfig.ui.primary = design.value.ui.primary;
+    appConfig.ui.gray = design.value.ui.gray;
+    setTabletColors(appConfig.ui.primary, appConfig.ui.gray);
+}
+setThemeColors();
+watch(design.value, setThemeColors);
 
 async function setUserLocale(): Promise<void> {
     logger.info('Setting user locale to', getUserLocale.value);
@@ -62,7 +62,7 @@ async function setUserLocale(): Promise<void> {
     }
 }
 setUserLocale();
-watch(getUserLocale, () => setUserLocale());
+watch(getUserLocale, setUserLocale);
 
 async function clickListener(event: MouseEvent): Promise<void> {
     if (!event.target || event.defaultPrevented) {
@@ -158,6 +158,10 @@ async function handleAuthedStateChange(): Promise<void> {
 watch(authedState, handleAuthedStateChange);
 handleAuthedStateChange();
 
+const onBeforeEnter = async () => {
+    await finalizePendingLocaleChange();
+};
+
 const router = useRouter();
 const route = router.currentRoute;
 </script>

diff --git a/app/components/auth/account/UserSettingsPanel.vue b/app/components/auth/account/UserSettingsPanel.vue
@@ -3,6 +3,7 @@ import type { RoutePathSchema } from '@typed-router';
 import ColorPickerTW from '~/components/partials/ColorPickerTW.vue';
 import { useSettingsStore } from '~/store/settings';
 import type { Perms } from '~~/gen/ts/perms';
+import { reminderTimes } from './helpers';
 
 const { t } = useI18n();
 
@@ -13,6 +14,7 @@ const { startpage, design, streamerMode, audio, calendar } = storeToRefs(setting
 
 const homepages: { name: string; path: RoutePathSchema; permission?: Perms }[] = [
     { name: t('common.overview'), path: '/overview' },
+    { name: t('common.mail'), path: '/mail', permission: 'MailerService.ListEmails' },
     { name: t('pages.citizens.title'), path: '/citizens', permission: 'CitizenStoreService.ListCitizens' },
     { name: t('pages.vehicles.title'), path: '/vehicles', permission: 'DMVService.ListVehicles' },
     { name: t('pages.documents.title'), path: '/documents', permission: 'DocStoreService.ListDocuments' },
@@ -26,8 +28,6 @@ const homepages: { name: string; path: RoutePathSchema; permission?: Perms }[] =
 const selectedHomepage = ref<(typeof homepages)[0]>();
 watch(selectedHomepage, () => (startpage.value = selectedHomepage.value?.path ?? '/overview'));
 
-onBeforeMount(async () => (selectedHomepage.value = homepages.find((h) => h.path === startpage.value)));
-
 const designDocumentsListStyle = ref(design.value.documents.listStyle === 'double');
 
 watch(designDocumentsListStyle, async () => {
@@ -38,16 +38,6 @@ watch(designDocumentsListStyle, async () => {
     }
 });
 
-const { ui } = useAppConfig();
-
-watch(design.value, async () => {
-    ui.primary = design.value.ui.primary;
-    ui.gray = design.value.ui.gray;
-
-    setTabletColors(ui.primary, ui.gray);
-});
-
-const reminderTimes = [300, 600, 900, 1800];
 const calendarReminderTimes = [
     { label: t('components.auth.UserSettingsPanel.calendar_notifications.reminder_times.start'), value: 0 },
     ...reminderTimes.map((n) => ({ label: `${n / 60} ${t('common.time_ago.minute', n / 60)}`, value: n })),
@@ -83,6 +73,8 @@ const selectedTab = computed({
         router.replace({ query: { tab: items[value]?.slot }, hash: '#' });
     },
 });
+
+onBeforeMount(async () => (selectedHomepage.value = homepages.find((h) => h.path === startpage.value)));
 </script>
 
 <template>

diff --git a/app/components/auth/account/helpers.ts b/app/components/auth/account/helpers.ts
@@ -0,0 +1 @@
+export const reminderTimes = [300, 600, 900, 1800];
diff --git a/app/components/centrum/partials/DispatchStatusBreakdown.vue b/app/components/centrum/partials/DispatchStatusBreakdown.vue
@@ -76,39 +76,42 @@ defineOptions({
         <template #panel>
             <div class="p-4">
                 <UIcon v-if="!counts" name="i-mdi-refresh" class="size-4 animate-spin" />
-                <ul v-else role="list" class="text-nowrap text-sm font-normal">
-                    <li>
-                        <span class="text-black" :class="dispatchStatusToBGColor(StatusDispatch.NEW)"
-                            >{{ $t('enums.centrum.StatusDispatch.UNASSIGNED') }}:</span
-                        >
-                        {{ counts?.unassigned }}
-                    </li>
-                    <li>
-                        <span class="text-black" :class="dispatchStatusToBGColor(StatusDispatch.EN_ROUTE)">{{
-                            $t('enums.centrum.StatusDispatch.EN_ROUTE')
-                        }}</span
-                        >: {{ counts.enRoute }}
-                    </li>
-                    <li>
-                        <span class="text-black" :class="dispatchStatusToBGColor(StatusDispatch.ON_SCENE)">{{
-                            $t('enums.centrum.StatusDispatch.ON_SCENE')
-                        }}</span
-                        >: {{ counts.onScene }}
-                    </li>
-                    <li>
-                        <span class="text-black" :class="dispatchStatusToBGColor(StatusDispatch.NEED_ASSISTANCE)">{{
-                            $t('enums.centrum.StatusDispatch.NEED_ASSISTANCE')
-                        }}</span
-                        >: {{ counts.needAssistance }}
-                    </li>
-                    <li>
-                        <span class="text-black" :class="dispatchStatusToBGColor(StatusDispatch.COMPLETED)"
-                            >{{ $t('enums.centrum.StatusDispatch.COMPLETED') }}:</span
-                        >
-                        {{ counts.completed }}
-                    </li>
-                    <li class="underline">{{ $t('common.total_count') }}: {{ dispatches.size }}</li>
-                </ul>
+                <div v-else class="flex flex-col gap-1 text-nowrap text-sm font-normal">
+                    <div class="inline-flex justify-between gap-1.5">
+                        <UBadge class="px-2 py-1" :class="dispatchStatusToBGColor(StatusDispatch.UNASSIGNED)" size="sm">
+                            {{ $t(`enums.centrum.StatusDispatch.${StatusDispatch[StatusDispatch.UNASSIGNED]}`) }}
+                        </UBadge>
+                        <p class="font-semibold">{{ counts?.unassigned }}</p>
+                    </div>
+                    <div class="inline-flex justify-between gap-1.5">
+                        <UBadge class="px-2 py-1" :class="dispatchStatusToBGColor(StatusDispatch.EN_ROUTE)" size="sm">
+                            {{ $t(`enums.centrum.StatusDispatch.${StatusDispatch[StatusDispatch.EN_ROUTE]}`) }}
+                        </UBadge>
+                        <p class="font-semibold">{{ counts.enRoute }}</p>
+                    </div>
+                    <div class="inline-flex justify-between gap-1.5">
+                        <UBadge class="px-2 py-1" :class="dispatchStatusToBGColor(StatusDispatch.ON_SCENE)" size="sm">
+                            {{ $t(`enums.centrum.StatusDispatch.${StatusDispatch[StatusDispatch.ON_SCENE]}`) }}
+                        </UBadge>
+                        <p class="font-semibold">{{ counts.onScene }}</p>
+                    </div>
+                    <div class="inline-flex justify-between gap-1.5">
+                        <UBadge class="px-2 py-1" :class="dispatchStatusToBGColor(StatusDispatch.NEED_ASSISTANCE)" size="sm">
+                            {{ $t(`enums.centrum.StatusDispatch.${StatusDispatch[StatusDispatch.NEED_ASSISTANCE]}`) }}
+                        </UBadge>
+                        <p class="font-semibold">{{ counts.needAssistance }}</p>
+                    </div>
+                    <div class="inline-flex justify-between gap-1.5">
+                        <UBadge class="px-2 py-1" :class="dispatchStatusToBGColor(StatusDispatch.COMPLETED)" size="sm">
+                            {{ $t(`enums.centrum.StatusDispatch.${StatusDispatch[StatusDispatch.COMPLETED]}`) }}
+                        </UBadge>
+                        <p class="font-semibold">{{ counts.completed }}</p>
+                    </div>
+                    <div class="flex justify-between font-semibold">
+                        <span>{{ $t('common.total_count') }}</span>
+                        <span>{{ dispatches.size }}</span>
+                    </div>
+                </div>
             </div>
         </template>
     </UPopover>

diff --git a/app/components/citizens/CitizensList.vue b/app/components/citizens/CitizensList.vue
@@ -1,4 +1,5 @@
 <script lang="ts" setup>
+import type { TableColumn } from '#ui/types';
 import { vMaska } from 'maska/vue';
 import { z } from 'zod';
 import PhoneNumberBlock from '~/components/partials/citizens/PhoneNumberBlock.vue';
@@ -167,7 +168,7 @@ const columns = [
               sortable: false,
           }
         : undefined,
-].filter((c) => c !== undefined) as { key: string; label: string; class?: string; rowClass?: string; sortable?: boolean }[];
+].filter((c) => c !== undefined) as TableColumn[];
 
 const input = useTemplateRef('input');
 

diff --git a/app/components/citizens/info/CitizenInfo.vue b/app/components/citizens/info/CitizenInfo.vue
@@ -1,4 +1,5 @@
 <script lang="ts" setup>
+import type { TabItem } from '#ui/types';
 import CitizenActivityFeed from '~/components/citizens/info/CitizenActivityFeed.vue';
 import CitizenDocuments from '~/components/citizens/info/CitizenDocuments.vue';
 import CitizenProfile from '~/components/citizens/info/CitizenProfile.vue';
@@ -28,7 +29,7 @@ const { attr, can } = useAuth();
 const clipboardStore = useClipboardStore();
 const notifications = useNotificatorStore();
 
-const items: { slot: string; label: string; icon: string; permission: Perms }[] = [
+const items: TabItem[] = [
     {
         slot: 'profile',
         label: t('common.profile'),
@@ -53,7 +54,7 @@ const items: { slot: string; label: string; icon: string; permission: Perms }[]
         icon: 'i-mdi-pulse',
         permission: 'CitizenStoreService.ListUserActivity' as Perms,
     },
-].filter((item) => can(item.permission).value);
+].flatMap((item) => (can(item.permission).value ? [item] : []));
 
 const {
     data: user,
@@ -195,19 +196,19 @@ const isOpen = ref(false);
                             </UContainer>
                         </template>
 
-                        <template v-if="can('DMVService.ListVehicles').value" #vehicles>
+                        <template #vehicles>
                             <UContainer>
                                 <CitizenVehicles :user-id="user.userId" />
                             </UContainer>
                         </template>
 
-                        <template v-if="can('DocStoreService.ListUserDocuments').value" #documents>
+                        <template #documents>
                             <UContainer>
                                 <CitizenDocuments :user-id="user.userId" />
                             </UContainer>
                         </template>
 
-                        <template v-if="can('CitizenStoreService.ListUserActivity').value" #activity>
+                        <template #activity>
                             <UContainer>
                                 <CitizenActivityFeed :user-id="user.userId" />
                             </UContainer>
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export const reminderTimes = [300, 600, 900, 1800];