feat: Add loader to timelines

This commit is contained in:
Jesse Wierzbinski 2024-12-02 17:22:43 +01:00
parent c483f35b99
commit db00a81ff9
No known key found for this signature in database
3 changed files with 4 additions and 5 deletions

View file

@ -11,9 +11,7 @@ import {
} from "@/components/ui/alert-dialog"; } from "@/components/ui/alert-dialog";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input"; import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { Textarea } from "@/components/ui/textarea"; import { Textarea } from "@/components/ui/textarea";
import { ref } from "vue";
import { import {
type ConfirmModalOptions, type ConfirmModalOptions,
type ConfirmModalResult, type ConfirmModalResult,

View file

@ -5,7 +5,6 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { Notification, Status } from "@versia/client/types"; import type { Notification, Status } from "@versia/client/types";
import { computed } from "vue";
import Note from "../notes/note.vue"; import Note from "../notes/note.vue";
import NotificationItem from "../notifications/notification.vue"; import NotificationItem from "../notifications/notification.vue";

View file

@ -7,7 +7,9 @@
@delete="removeItem" /> @delete="removeItem" />
</TransitionGroup> </TransitionGroup>
<!-- <TimelineItem v-if="isLoading" :type="type" v-for="_ in 5" /> --> <div v-if="isLoading" class="p-4 flex items-center justify-center h-48">
<Loader class="size-8 animate-spin" />
</div>
<div v-if="error" class="timeline-error"> <div v-if="error" class="timeline-error">
{{ error.message }} {{ error.message }}
@ -46,7 +48,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { Notification, Status } from "@versia/client/types"; import type { Notification, Status } from "@versia/client/types";
import { useIntersectionObserver } from "@vueuse/core"; import { useIntersectionObserver } from "@vueuse/core";
import { onMounted, watch } from "vue"; import { Loader } from "lucide-vue-next";
import { import {
Card, Card,
CardDescription, CardDescription,