mirror/api
1
0
Fork 0
mirror of https://github.com/unraid/api.git synced 2026-01-06 08:39:54 -06:00
Code Issues Packages Projects Releases Wiki Activity

feat(web): add empty state to notifications list

Browse Source
This commit is contained in:
Pujit Mehrotra
2024-10-30 11:02:50 -04:00
parent 9968e0f7df
commit 323a4a17cf
2 changed files with 10 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
web/components/Notifications/List.vue
View File

@@ -7,6 +7,7 @@ import type { Importance, NotificationType } from "~/composables/gql/graphql";
import { useFragment } from "~/composables/gql/fragment-masking";
import { useQuery } from "@vue/apollo-composable";
import { vInfiniteScroll } from "@vueuse/components";
import { CheckIcon } from "@heroicons/vue/24/solid";
/**
* Page size is the max amount of items fetched from the api in a single request.
@@ -63,6 +64,13 @@ async function onLoadMore() {
</script>
<template>
<div
v-if="notifications?.length === 0"
class="h-full flex flex-col items-center justify-center gap-3"
>
<CheckIcon class="h-10 text-green-600" />
No notifications to see here!
</div>
<!-- The horizontal padding here adjusts for the scrollbar offset -->
<div
v-if="notifications?.length > 0"

4
web/components/Notifications/Sidebar.vue
View File

@@ -9,8 +9,8 @@ import {
} from "@/components/shadcn/sheet";
import { archiveAllNotifications } from "./graphql/notification.query";
import type { Importance} from "~/composables/gql/graphql";
import { NotificationType } from "~/composables/gql/graphql";
// eslint-disable-next-line @typescript-eslint/consistent-type-imports -- false positive :(
import { Importance, NotificationType } from "~/composables/gql/graphql";
import { useMutation } from "@vue/apollo-composable";
const { mutate: archiveAll, loading: loadingArchiveAll } = useMutation(