Squashed commit of the following:v0.1.3

commit 56e0a38b2ca246e8beeaef3c6c4b9c0ce7d0f09b
Author: vnugent <public@vaughnnugent.com>
Date:   Tue Apr 9 17:35:13 2024 -0400

    chore(app): Update deps, login spinner, curl msg, view prep

commit 0945210c0492dd8a8de99ccd8e5e66cf05e3a1c1
Merge: 24fac82 3c15d54
Author: vnugent <public@vaughnnugent.com>
Date:   Tue Apr 2 14:58:59 2024 -0400

    Merge branch 'master' into develop

commit 24fac82efe9e5c18e86ed535678640e7401472db
Author: vnugent <public@vaughnnugent.com>
Date:   Tue Apr 2 14:54:20 2024 -0400

    ci: Configure manual dep versions

commit d2ae31ec919d72e66d8b40db8394b55efd6ea6d3
Author: vnugent <public@vaughnnugent.com>
Date:   Sun Mar 31 22:19:53 2024 -0400

    ci: Native compression support for win

commit fa7fdef79c6d468022b77f81314ac129fe0cdc32
Merge: 308092d a01220a
Author: vnugent <public@vaughnnugent.com>
Date:   Wed Mar 13 21:26:55 2024 -0400

    Merge branch 'master' into develop

commit 308092d6d743d0ba8f7ca86fd77e9c837dc46e88
Merge: 48637a8 9134093
Author: vnugent <public@vaughnnugent.com>
Date:   Wed Mar 13 21:01:02 2024 -0400

    Merge branch 'master' into develop

commit 48637a8781fc951c307216f604fc1610e68691c3
Merge: 1e08c6d e326736
Author: vnugent <public@vaughnnugent.com>
Date:   Wed Mar 13 16:20:35 2024 -0400

    Merge branch 'master' into develop

commit 1e08c6d2112459dc02a0ab873123c4a363b01d21
Author: vnugent <public@vaughnnugent.com>
Date:   Wed Mar 13 16:17:58 2024 -0400

    ci: verified container build ready for next release

commit 85a1e5b7cc5c99e97a2d4e99bbceb0d2139742ff
Author: vnugent <public@vaughnnugent.com>
Date:   Tue Mar 12 22:05:16 2024 -0400

    ci: exciting bare-metal build process, os support, smaller packages

commit 748cdbf4880d830fd794e92856e8c35a46e4f884
Author: vnugent <public@vaughnnugent.com>
Date:   Mon Mar 11 21:21:18 2024 -0400

    feat(app): #1 update libs & add curl support

1 files changed, 8 insertions, 69 deletions

diff --git a/front-end/src/components/Bookmarks.vue b/front-end/src/components/Bookmarks.vue
index 274b0b4..b83743c 100644
--- a/front-end/src/components/Bookmarks.vue
+++ b/front-end/src/components/Bookmarks.vue
@@ -1,31 +1,28 @@
 <script setup lang="ts">
 import { MaybeRef, Ref, computed, defineAsyncComponent, ref, shallowRef, watch } from 'vue';
 import { useQuery, useStore } from '../store';
-import { get, set, formatTimeAgo, useToggle, useTimestamp, useFileDialog, asyncComputed, toReactive, useClipboard } from '@vueuse/core';
+import { get, set, useToggle, useFileDialog, asyncComputed, toReactive } from '@vueuse/core';
 import { useVuelidate } from '@vuelidate/core';
 import { required, maxLength, minLength, helpers } from '@vuelidate/validators';
-import { apiCall, useConfirm, useGeneralToaster, useVuelidateWrapper, useWait } from '@vnuge/vnlib.browser';
-import { clone, cloneDeep, join, defaultTo, every, filter, includes, isEmpty, isEqual, first, isString, chunk, map, forEach, isNil } from 'lodash-es';
+import { apiCall, useGeneralToaster, useVuelidateWrapper, useWait } from '@vnuge/vnlib.browser';
+import { clone, cloneDeep, defaultTo, every, filter, includes, isEmpty, isEqual, first, isString, chunk, map, forEach, isNil } from 'lodash-es';
 import { Menu, MenuButton, MenuItems, MenuItem } from '@headlessui/vue'
 import { parseNetscapeBookmarkString } from './Boomarks/util.ts';
 import type { BatchUploadResult, Bookmark, BookmarkError } from '../store/bookmarks';
 import AddOrUpdateForm from './Boomarks/AddOrUpdateForm.vue';
+import BookmarkList from './Boomarks/BookmarkList.vue';
 const Dialog = defineAsyncComponent(() => import('./global/Dialog.vue'));
 
 const store = useStore();
 const { waiting } = useWait();
-const { reveal } = useConfirm();
 const toaster = useGeneralToaster();
 const bookmarks = computed(() => store.bookmarks.list);
 const tags = computed(() => store.bookmarks.allTags);
-const now = useTimestamp({interval: 1000});
+
 const selectedTags = computed(() => store.bookmarks.tags);
 const localSearch = shallowRef<string>(store.bookmarks.query);
 const nextPageAvailable = computed(() => isEqual(bookmarks.value?.length, get(store.bookmarks.pages.currentPageSize)));
-const { copy } = useClipboard()
 
-//Refresh on page load
-store.bookmarks.refresh();
 
 const safeNameRegex = /^[a-zA-Z0-9_\-\|\., ]*$/;
 const safeUrlRegex = /^(https?|ftp):\/\/[^\s/$.?#].[^\s]*$/;
@@ -76,27 +73,6 @@ const clear = () => {
     set(localSearch, '');
 }
 
-const bmDelete = async (bookmark: Bookmark) => {
-    const { isCanceled } = await reveal({
-        title: 'Delete bookmark',
-        text: `Are you sure you want to delete ${bookmark.Name} ?`,
-    })
-
-    if(isCanceled) return;
-
-    apiCall(async ({ toaster }) => {
-
-        await store.bookmarks.api.delete(bookmark);
-
-        toaster.general.success({
-            title: 'Bookmark deleted',
-            text: 'Bookmark has been deleted successfully'
-        });
-
-        store.bookmarks.refresh();
-    })
-}
-
 const isTagSelected = (tag: string, currentTags: MaybeRef<string[]>) => includes(get(currentTags), tag);
 const execSearch = () => store.bookmarks.query = get(localSearch);
 const clearTags = () => store.bookmarks.tags = [];
@@ -441,43 +417,9 @@ const upload = (() => {
                 </div>
 
                 <div class="mx-auto sm:mt-2">
-                    <div class="grid h-full grid-cols-1 gap-1 leading-tight md:leading-normal">
-                        
-                        <div v-for="bm in bookmarks" :key="bm.Id" :id="join(['bm', bm.Id], '-')" class="w-full p-1">
-                            <div class="">
-                                <a class="bl-link" :href="bm.Url" target="_blank">
-                                    {{ bm.Name }}
-                                </a>
-                            </div>
-                            <div class="flex flex-row items-center">
-                                <span v-for="tag in bm.Tags">
-                                    <span class="mr-1 text-sm text-teal-500 cursor-pointer dark:text-teal-300" @click="toggleTag(tag)">
-                                        #{{ tag }}
-                                    </span>
-                                </span>
-                                <p class="ml-2 text-sm text-gray-500 truncate dark:text-gray-400 text-ellipsis">
-                                    {{ bm.Description }}
-                                </p>
-                            </div>
-                            <div class="">
-                                <span class="text-xs text-gray-500 dark:text-gray-400">
-                                    {{ formatTimeAgo(new Date(bm.Created), {}, now) }}
-                                </span>
-                                | 
-                                <span class="inline-flex gap-1.5">
-                                    <button class="text-xs text-gray-700 dark:text-gray-400" @click="copy(bm.Url)">
-                                        Copy
-                                    </button>
-                                    <button class="text-xs text-gray-700 dark:text-gray-400" @click="edit.editBookmark(bm)">
-                                        Edit
-                                    </button>  
-                                    <button class="text-xs text-gray-700 dark:text-gray-400" @click="bmDelete(bm)">
-                                        Delete
-                                    </button>
-                                </span>
-                            </div>
-                        </div>
-                    </div>
+                    
+                    <BookmarkList @toggle-tag="toggleTag" @edit="edit.editBookmark" />
+                  
                     <div class="pr-4 mt-5 mb-10 ml-auto w-fit">
                         <div class="flex flex-col items-center">
                             <div class="text-sm">
@@ -600,9 +542,6 @@ const upload = (() => {
                                 Upload
                             </button>
                         </div> 
-                        <div class="">
-                           
-                        </div>
                     </form>
                 </div>
            </div>