From cb60e5e3f1ad2a372cf12ec75d258f62806295a7 Mon Sep 17 00:00:00 2001
From: nency-canyon <nency.bhadeshiya@canyongbs.com>
Date: Wed, 1 Jul 2026 22:52:23 +0530
Subject: [PATCH 1/8] feat: add shared portal components

---
 resources/js/components/portal/HeroSearch.vue | 131 ++++++++++++++++++
 resources/js/components/portal/Subheading.vue |  48 +++++++
 .../components/portal/home/CategoryCard.vue   |  80 +++++++++++
 .../js/components/portal/home/HelpCenter.vue  |  61 ++++++++
 .../js/components/portal/home/HeroSearch.vue  |  94 +++++++++++++
 .../components/portal/home/SearchLoading.vue  |  40 ++++++
 .../components/portal/home/SearchResults.vue  | 129 +++++++++++++++++
 7 files changed, 583 insertions(+)
 create mode 100644 resources/js/components/portal/HeroSearch.vue
 create mode 100644 resources/js/components/portal/Subheading.vue
 create mode 100644 resources/js/components/portal/home/CategoryCard.vue
 create mode 100644 resources/js/components/portal/home/HelpCenter.vue
 create mode 100644 resources/js/components/portal/home/HeroSearch.vue
 create mode 100644 resources/js/components/portal/home/SearchLoading.vue
 create mode 100644 resources/js/components/portal/home/SearchResults.vue

diff --git a/resources/js/components/portal/HeroSearch.vue b/resources/js/components/portal/HeroSearch.vue
new file mode 100644
index 0000000..f5710cb
--- /dev/null
+++ b/resources/js/components/portal/HeroSearch.vue
@@ -0,0 +1,131 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import BaseBadge from '../BaseBadge.vue';
+    import { MagnifyingGlassIcon, TagIcon } from '@heroicons/vue/20/solid';
+    import { ref } from 'vue';
+
+    defineProps({
+        modelValue: {
+            type: String,
+            default: '',
+        },
+        tags: {
+            type: Object,
+            required: true,
+        },
+        selectedTags: {
+            type: Array,
+            required: true,
+        },
+    });
+
+    const emit = defineEmits(['update:modelValue', 'toggle-tag']);
+
+    const inputRef = ref(null);
+    const tagsMode = ref('selected');
+
+    defineExpose({
+        focus: () => inputRef.value?.focus(),
+    });
+</script>
+
+<template>
+    <label for="search" class="sr-only">Search</label>
+    <div
+        class="rounded-lg bg-white/10 ring-1 ring-white/20 transition duration-75 focus-within:bg-white/15 focus-within:ring-2 focus-within:ring-white/40"
+    >
+        <div class="flex">
+            <div class="flex items-center gap-x-3 ps-3 pe-2">
+                <MagnifyingGlassIcon class="size-5 text-white/70" aria-hidden="true" />
+            </div>
+            <div class="min-w-0 flex-1">
+                <input
+                    ref="inputRef"
+                    type="search"
+                    :value="modelValue"
+                    @input="emit('update:modelValue', $event.target.value)"
+                    id="search"
+                    autocomplete="off"
+                    placeholder="Search for articles and categories"
+                    class="block w-full appearance-none border-none bg-transparent ps-0 px-3 py-2 text-start text-sm leading-6 text-white placeholder:text-white/50 focus:placeholder:text-white/75 focus:ring-0 focus:outline-none [&::-webkit-search-cancel-button]:invert [&::-webkit-search-cancel-button]:brightness-0 [&::-webkit-search-cancel-button]:opacity-70 [&::-webkit-search-cancel-button]:hover:opacity-100"
+                />
+            </div>
+        </div>
+
+        <div v-if="tags.length > 0" class="flex flex-wrap items-center gap-2 border-t border-white/15 px-3 py-2">
+            <button
+                type="button"
+                @click="tagsMode = tagsMode === 'selected' ? 'all' : 'selected'"
+                class="inline-flex shrink-0 items-center gap-x-1.5 rounded-md px-2 py-1 text-xs font-medium ring-1 ring-inset transition duration-75"
+                :class="
+                    tagsMode === 'all'
+                        ? 'bg-white/20 text-white ring-white/40'
+                        : 'bg-white/10 text-white/70 ring-white/20 hover:bg-white/15 hover:text-white/90'
+                "
+            >
+                <TagIcon class="size-3" aria-hidden="true" />
+                <template v-if="tagsMode === 'selected' && selectedTags.length > 0">
+                    Filter by tag · {{ selectedTags.length }}
+                </template>
+                <template v-else>Filter by tag</template>
+            </button>
+
+            <template v-if="tagsMode === 'selected'">
+                <BaseBadge
+                    v-for="tag in tags.filter((t) => selectedTags.includes(t.id))"
+                    :key="tag.id"
+                    tag="button"
+                    color="transparent-white"
+                    @click="emit('toggle-tag', tag.id)"
+                >
+                    {{ tag.name }}
+                </BaseBadge>
+            </template>
+
+            <template v-else>
+                <BaseBadge
+                    v-for="tag in tags"
+                    :key="tag.id"
+                    tag="button"
+                    color="transparent-white"
+                    :class="selectedTags.includes(tag.id) ? '' : 'opacity-60 hover:opacity-90'"
+                    @click="emit('toggle-tag', tag.id)"
+                >
+                    {{ tag.name }}
+                </BaseBadge>
+            </template>
+        </div>
+    </div>
+</template>
diff --git a/resources/js/components/portal/Subheading.vue b/resources/js/components/portal/Subheading.vue
new file mode 100644
index 0000000..0c0ee42
--- /dev/null
+++ b/resources/js/components/portal/Subheading.vue
@@ -0,0 +1,48 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    defineProps({
+        title: {
+            type: String,
+            default: '',
+        },
+    });
+</script>
+
+<template>
+    <h2 class="text-xl font-medium text-gray-950">
+        <template v-if="$slots.default"><slot /></template>
+        <template v-else>{{ title }}</template>
+    </h2>
+</template>
diff --git a/resources/js/components/portal/home/CategoryCard.vue b/resources/js/components/portal/home/CategoryCard.vue
new file mode 100644
index 0000000..7cfdc2e
--- /dev/null
+++ b/resources/js/components/portal/home/CategoryCard.vue
@@ -0,0 +1,80 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import { ChevronRightIcon } from '@heroicons/vue/20/solid';
+
+    defineProps({
+        to: {
+            type: [Object, String],
+            required: true,
+        },
+        icon: {
+            type: String,
+            default: null,
+        },
+        name: {
+            type: String,
+            required: true,
+        },
+        description: {
+            type: String,
+            default: null,
+        },
+    });
+</script>
+
+<template>
+    <router-link
+        :to="to"
+        class="group flex items-start w-full gap-3 rounded-xl bg-white px-6 py-4 ring-1 ring-gray-950/5 transition duration-75 hover:bg-gray-50"
+    >
+        <div
+            v-if="icon"
+            v-html="icon"
+            class="shrink-0 text-gray-400 [&>svg]:size-6 transition duration-75 group-hover:text-brand-500"
+            aria-hidden="true"
+        ></div>
+
+        <div class="mt-0.5 grid flex-1 gap-1 min-w-0">
+            <span class="text-sm font-medium text-gray-950">{{ name }}</span>
+            <p class="overflow-hidden text-sm text-pretty break-words text-gray-500">
+                {{ description }}
+            </p>
+        </div>
+
+        <ChevronRightIcon
+            class="shrink-0 size-5 self-center text-gray-400 opacity-0 transition-all group-hover:translate-x-1 group-hover:opacity-100"
+        />
+    </router-link>
+</template>
diff --git a/resources/js/components/portal/home/HelpCenter.vue b/resources/js/components/portal/home/HelpCenter.vue
new file mode 100644
index 0000000..0bacedb
--- /dev/null
+++ b/resources/js/components/portal/home/HelpCenter.vue
@@ -0,0 +1,61 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import CategoryCard from './CategoryCard.vue';
+    import Subheading from '../Subheading.vue';
+
+    defineProps({
+        categories: {
+            type: Object,
+            required: true,
+        },
+    });
+</script>
+
+<template>
+    <div class="flex flex-col gap-4">
+        <Subheading title="Article Categories" />
+
+        <div class="grid gap-3 md:grid-cols-2">
+            <CategoryCard
+                v-for="category in categories"
+                :key="category.id"
+                :to="{ name: 'view-category', params: { categoryId: category.id } }"
+                :icon="category.icon"
+                :name="category.name"
+                :description="category.description"
+            />
+        </div>
+    </div>
+</template>
diff --git a/resources/js/components/portal/home/HeroSearch.vue b/resources/js/components/portal/home/HeroSearch.vue
new file mode 100644
index 0000000..3c1a2ee
--- /dev/null
+++ b/resources/js/components/portal/home/HeroSearch.vue
@@ -0,0 +1,94 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import { Bars3Icon, MagnifyingGlassIcon } from '@heroicons/vue/24/outline';
+    import { computed } from 'vue';
+
+    const props = defineProps({
+        modelValue: {
+            type: [String, null],
+            default: null,
+        },
+    });
+
+    const emit = defineEmits(['update:modelValue', 'sidebarOpened']);
+
+    const searchQuery = computed({
+        get() {
+            return props.modelValue;
+        },
+        set(value) {
+            emit('update:modelValue', value);
+        },
+    });
+</script>
+
+<template>
+    <div class="sticky top-0 z-40 bg-gray-50 lg:hidden">
+        <button class="w-full p-3" type="button" @click="emit('sidebarOpened')">
+            <span class="sr-only">Open sidebar</span>
+
+            <Bars3Icon class="h-6 w-6 text-gray-900"></Bars3Icon>
+        </button>
+    </div>
+
+    <div
+        class="bg-[linear-gradient(to_right_bottom,rgba(var(--primary-500),1),rgba(var(--primary-800),1))] w-full px-6"
+    >
+        <div class="max-w-screen-xl flex flex-col gap-y-6 mx-auto py-8">
+            <div class="flex flex-col gap-y-1 text-left">
+                <h3 class="text-3xl font-semibold text-white">Need help?</h3>
+                <p class="text-primary-100">Search our resource hub for advice and answers</p>
+            </div>
+
+            <form action="#" method="GET">
+                <label for="search" class="sr-only">Search</label>
+
+                <div class="relative rounded">
+                    <div class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-4">
+                        <MagnifyingGlassIcon class="h-5 w-5 text-gray-400" aria-hidden="true" />
+                    </div>
+
+                    <input
+                        id="search"
+                        v-model="searchQuery"
+                        type="search"
+                        placeholder="Search for articles and categories"
+                        class="block w-full rounded border-0 py-3 pl-12 text-gray-900 ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-primary-200 sm:text-sm sm:leading-6"
+                    />
+                </div>
+            </form>
+        </div>
+    </div>
+</template>
diff --git a/resources/js/components/portal/home/SearchLoading.vue b/resources/js/components/portal/home/SearchLoading.vue
new file mode 100644
index 0000000..0c78292
--- /dev/null
+++ b/resources/js/components/portal/home/SearchLoading.vue
@@ -0,0 +1,40 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import LoadingSpinner from '../../LoadingSpinner.vue';
+</script>
+
+<template>
+    <LoadingSpinner label="Searching Resource Hub..." />
+</template>
diff --git a/resources/js/components/portal/home/SearchResults.vue b/resources/js/components/portal/home/SearchResults.vue
new file mode 100644
index 0000000..7ead34f
--- /dev/null
+++ b/resources/js/components/portal/home/SearchResults.vue
@@ -0,0 +1,129 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import { ChevronRightIcon, XMarkIcon } from '@heroicons/vue/20/solid';
+    import SearchLoading from './SearchLoading.vue';
+
+    defineProps({
+        searchQuery: {
+            type: String,
+            required: true,
+        },
+        searchResults: {
+            type: Object,
+            required: true,
+        },
+        loadingResults: {
+            type: Boolean,
+            required: true,
+        },
+    });
+</script>
+
+<template>
+    <div v-if="loadingResults">
+        <SearchLoading />
+    </div>
+
+    <div v-if="!loadingResults && searchResults?.data" class="flex flex-col gap-6">
+        <h3 class="text-2xl font-bold text-primary-950">
+            Search results: <span class="font-normal">{{ searchQuery }}</span>
+        </h3>
+
+        <div
+            class="flex flex-col divide-y divide-gray-200 ring-1 ring-black/5 shadow-xs px-3 pt-3 pb-1 rounded bg-white"
+        >
+            <h4 class="text-lg font-semibold text-gray-800 px-3 pt-1 pb-3">
+                Articles ({{ searchResults.data.articles.length }})
+            </h4>
+
+            <div v-if="searchResults.data.articles.length > 0">
+                <ul role="list" class="divide-y divide-gray-200">
+                    <li v-for="article in searchResults.data.articles" :key="article.id">
+                        <router-link
+                            :to="{
+                                name: 'view-article',
+                                params: { categoryId: article.categoryId, articleId: article.id },
+                            }"
+                            class="group p-3 flex items-start text-sm font-medium text-gray-700"
+                        >
+                            <h5>
+                                {{ article.name }}
+                            </h5>
+
+                            <ChevronRightIcon
+                                class="opacity-0 h-5 w-5 text-primary-600 transition-all group-hover:translate-x-2 group-hover:opacity-100"
+                            />
+                        </router-link>
+                    </li>
+                </ul>
+            </div>
+            <div v-else class="p-3 flex items-start gap-2">
+                <XMarkIcon class="h-5 w-5 text-gray-400" />
+
+                <p class="text-gray-600 text-sm font-medium">No articles found that match this search.</p>
+            </div>
+        </div>
+
+        <div
+            class="flex flex-col divide-y divide-gray-200 ring-1 ring-black/5 shadow-xs px-3 pt-3 pb-1 rounded bg-white"
+        >
+            <h4 class="text-lg font-semibold text-gray-800 px-3 pt-1 pb-3">Categories</h4>
+
+            <div v-if="searchResults.data.categories.length > 0">
+                <ul role="list" class="divide-y divide-gray-200">
+                    <li v-for="category in searchResults.data.categories" :key="category.id">
+                        <router-link
+                            :to="{ name: 'view-category', params: { categoryId: category.id } }"
+                            class="group p-3 flex items-start text-sm font-medium text-gray-700"
+                        >
+                            <h5>
+                                {{ category.name }}
+                            </h5>
+
+                            <ChevronRightIcon
+                                class="opacity-0 h-5 w-5 text-primary-600 transition-all group-hover:translate-x-2 group-hover:opacity-100"
+                            />
+                        </router-link>
+                    </li>
+                </ul>
+            </div>
+            <div v-else class="p-3 flex items-start gap-2">
+                <XMarkIcon class="h-5 w-5 text-gray-400" />
+
+                <p class="text-gray-600 text-sm font-medium">No categories found that match this search.</p>
+            </div>
+        </div>
+    </div>
+</template>

From 715450628d011c9e3791726513a3f7133a4d6c8b Mon Sep 17 00:00:00 2001
From: nency-canyon <nency.bhadeshiya@canyongbs.com>
Date: Thu, 2 Jul 2026 19:10:31 +0530
Subject: [PATCH 2/8] feat: add category page portal components

---
 .../js/components/portal/Breadcrumbs.vue      |  89 +++++++++
 resources/js/components/portal/Page.vue       |  59 ++++++
 resources/js/components/portal/Pagination.vue | 174 ++++++++++++++++++
 .../js/components/portal/ResourceList.vue     |  95 ++++++++++
 .../js/components/portal/ResourceListItem.vue |  71 +++++++
 resources/js/components/portal/Tabs.vue       |  83 +++++++++
 resources/js/components/portal/Tags.vue       |  60 ++++++
 .../js/components/portal/category/Article.vue |  65 +++++++
 .../portal/category/SearchResults.vue         | 114 ++++++++++++
 .../portal/category/SubCategories.vue         |  62 +++++++
 10 files changed, 872 insertions(+)
 create mode 100644 resources/js/components/portal/Breadcrumbs.vue
 create mode 100644 resources/js/components/portal/Page.vue
 create mode 100644 resources/js/components/portal/Pagination.vue
 create mode 100644 resources/js/components/portal/ResourceList.vue
 create mode 100644 resources/js/components/portal/ResourceListItem.vue
 create mode 100644 resources/js/components/portal/Tabs.vue
 create mode 100644 resources/js/components/portal/Tags.vue
 create mode 100644 resources/js/components/portal/category/Article.vue
 create mode 100644 resources/js/components/portal/category/SearchResults.vue
 create mode 100644 resources/js/components/portal/category/SubCategories.vue

diff --git a/resources/js/components/portal/Breadcrumbs.vue b/resources/js/components/portal/Breadcrumbs.vue
new file mode 100644
index 0000000..c02b5ba
--- /dev/null
+++ b/resources/js/components/portal/Breadcrumbs.vue
@@ -0,0 +1,89 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import { ChevronRightIcon } from '@heroicons/vue/20/solid';
+
+    defineProps({
+        currentCrumb: {
+            type: String,
+            required: true,
+        },
+        breadcrumbs: {
+            type: Array,
+            default: () => [],
+        },
+    });
+
+    const emit = defineEmits(['crumb-click']);
+</script>
+
+<template>
+    <nav aria-label="Breadcrumb">
+        <ol class="flex flex-wrap items-center gap-x-2">
+            <li v-if="currentCrumb !== 'Home'" class="flex items-center gap-x-2 text-sm font-medium">
+                <router-link :to="{ name: 'home' }" class="text-white/70 transition duration-75 hover:text-white">
+                    Home
+                </router-link>
+            </li>
+            <li
+                v-for="(crumb, index) in breadcrumbs"
+                :key="(crumb.id || crumb.name) + index"
+                class="flex items-center gap-x-2 text-sm font-medium"
+            >
+                <ChevronRightIcon class="size-5 text-white/40" aria-hidden="true" />
+
+                <template v-if="crumb.route">
+                    <router-link
+                        :to="{ name: crumb.route, params: crumb.params }"
+                        class="text-white/70 transition duration-75 hover:text-white"
+                    >
+                        {{ crumb.name }}
+                    </router-link>
+                </template>
+                <template v-else>
+                    <button
+                        @click="emit('crumb-click', crumb)"
+                        class="text-white/70 transition duration-75 hover:text-white"
+                    >
+                        {{ crumb.name }}
+                    </button>
+                </template>
+            </li>
+            <li class="flex items-center gap-x-2 text-sm font-medium">
+                <ChevronRightIcon v-if="currentCrumb !== 'Home'" class="size-5 text-white/40" aria-hidden="true" />
+                <span class="text-white">{{ currentCrumb }}</span>
+            </li>
+        </ol>
+    </nav>
+</template>
diff --git a/resources/js/components/portal/Page.vue b/resources/js/components/portal/Page.vue
new file mode 100644
index 0000000..0fa9475
--- /dev/null
+++ b/resources/js/components/portal/Page.vue
@@ -0,0 +1,59 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup></script>
+
+<template>
+    <div class="flex-1 bg-gray-50">
+        <div class="bg-[linear-gradient(to_right_bottom,rgba(var(--primary-500),1),rgba(var(--primary-800),1))]">
+            <div class="max-w-(--breakpoint-xl) flex flex-col gap-y-6 mx-auto px-6 py-12">
+                <div class="flex flex-col gap-y-3 text-left">
+                    <slot name="breadcrumbs" />
+
+                    <div class="flex flex-col gap-y-2">
+                        <h1 class="text-3xl font-bold text-white"><slot name="heading" /></h1>
+                        <div v-if="$slots.description" class="text-sm text-white/75"><slot name="description" /></div>
+                    </div>
+                </div>
+
+                <div v-if="$slots.belowHeaderContent">
+                    <slot name="belowHeaderContent" />
+                </div>
+            </div>
+        </div>
+
+        <div class="max-w-(--breakpoint-xl) mx-auto px-6 py-8 flex flex-col gap-y-6">
+            <slot />
+        </div>
+    </div>
+</template>
diff --git a/resources/js/components/portal/Pagination.vue b/resources/js/components/portal/Pagination.vue
new file mode 100644
index 0000000..219a1d4
--- /dev/null
+++ b/resources/js/components/portal/Pagination.vue
@@ -0,0 +1,174 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import { ChevronLeftIcon, ChevronRightIcon } from '@heroicons/vue/20/solid';
+    import { computed } from 'vue';
+
+    const props = defineProps({
+        currentPage: {
+            type: Number,
+            required: true,
+        },
+        lastPage: {
+            type: Number,
+            required: true,
+        },
+        fromItem: {
+            type: Number,
+            required: true,
+        },
+        toItem: {
+            type: Number,
+            required: true,
+        },
+        totalItems: {
+            type: Number,
+            required: true,
+        },
+    });
+
+    const emit = defineEmits(['fetchNextPage', 'fetchPreviousPage', 'fetchPage']);
+
+    const paginationElements = computed(() => {
+        const elements = [];
+        const current = props.currentPage;
+        const last = props.lastPage;
+
+        if (last <= 7) {
+            for (let i = 1; i <= last; i++) elements.push(i);
+            return elements;
+        }
+
+        elements.push(1);
+
+        if (current > 3) elements.push('...');
+
+        const start = Math.max(2, current - 1);
+        const end = Math.min(last - 1, current + 1);
+
+        for (let i = start; i <= end; i++) elements.push(i);
+
+        if (current < last - 2) elements.push('...');
+
+        elements.push(last);
+
+        return elements;
+    });
+</script>
+
+<template>
+    <nav
+        aria-label="Pagination"
+        role="navigation"
+        class="grid grid-cols-[1fr_auto_1fr] items-center gap-x-3 border-t border-gray-200 px-6 py-3"
+        :class="lastPage <= 1 && 'hidden md:grid'"
+    >
+        <button
+            v-if="currentPage > 1"
+            type="button"
+            @click="emit('fetchPreviousPage')"
+            class="justify-self-start md:hidden relative inline-grid grid-flow-col items-center justify-center gap-1.5 rounded-lg px-3 py-2 text-sm font-medium outline-none transition duration-75 text-gray-950 ring-1 ring-gray-950/10 hover:bg-gray-50 focus-visible:ring-2"
+        >
+            Previous
+        </button>
+
+        <span class="hidden md:inline text-sm font-medium text-gray-700">
+            Showing {{ fromItem }} to {{ toItem }} of {{ totalItems }} results
+        </span>
+
+        <button
+            v-if="currentPage < lastPage"
+            type="button"
+            @click="emit('fetchNextPage')"
+            class="col-start-3 justify-self-end md:hidden relative inline-grid grid-flow-col items-center justify-center gap-1.5 rounded-lg px-3 py-2 text-sm font-medium outline-none transition duration-75 text-gray-950 ring-1 ring-gray-950/10 hover:bg-gray-50 focus-visible:ring-2"
+        >
+            Next
+        </button>
+
+        <ol
+            v-if="lastPage > 1"
+            class="hidden md:flex col-start-3 justify-self-end divide-x divide-gray-200 rounded-lg bg-white shadow-sm ring-1 ring-gray-950/10"
+        >
+            <li>
+                <button
+                    type="button"
+                    :disabled="currentPage === 1"
+                    aria-label="Previous page"
+                    @click="emit('fetchPreviousPage')"
+                    class="relative flex overflow-hidden p-2 transition duration-75 outline-none rounded-s-lg enabled:hover:bg-gray-50 enabled:focus-visible:z-10 enabled:focus-visible:ring-2 enabled:focus-visible:ring-brand-600"
+                >
+                    <ChevronLeftIcon class="size-5 text-gray-400 transition duration-75" />
+                </button>
+            </li>
+
+            <li v-for="(element, index) in paginationElements" :key="index">
+                <button
+                    v-if="element === '...'"
+                    type="button"
+                    disabled
+                    class="relative flex overflow-hidden p-2 transition duration-75 outline-none"
+                >
+                    <span class="px-1.5 text-sm font-semibold text-gray-500">&hellip;</span>
+                </button>
+                <button
+                    v-else
+                    type="button"
+                    :aria-label="`Go to page ${element}`"
+                    @click="emit('fetchPage', element)"
+                    class="relative flex overflow-hidden p-2 transition duration-75 outline-none enabled:hover:bg-gray-50 enabled:focus-visible:z-10 enabled:focus-visible:ring-2 enabled:focus-visible:ring-brand-600"
+                    :class="element === currentPage && 'bg-gray-50'"
+                >
+                    <span
+                        class="px-1.5 text-sm font-semibold"
+                        :class="element === currentPage ? 'text-brand-700' : 'text-gray-700'"
+                    >
+                        {{ element }}
+                    </span>
+                </button>
+            </li>
+
+            <li>
+                <button
+                    type="button"
+                    :disabled="currentPage === lastPage"
+                    aria-label="Next page"
+                    @click="emit('fetchNextPage')"
+                    class="relative flex overflow-hidden p-2 transition duration-75 outline-none rounded-e-lg enabled:hover:bg-gray-50 enabled:focus-visible:z-10 enabled:focus-visible:ring-2 enabled:focus-visible:ring-brand-600"
+                >
+                    <ChevronRightIcon class="size-5 text-gray-400 transition duration-75" />
+                </button>
+            </li>
+        </ol>
+    </nav>
+</template>
diff --git a/resources/js/components/portal/ResourceList.vue b/resources/js/components/portal/ResourceList.vue
new file mode 100644
index 0000000..e2d4e2c
--- /dev/null
+++ b/resources/js/components/portal/ResourceList.vue
@@ -0,0 +1,95 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import Pagination from './Pagination.vue';
+
+    defineProps({
+        heading: {
+            type: String,
+            default: null,
+        },
+        currentPage: {
+            type: Number,
+            default: null,
+        },
+        lastPage: {
+            type: Number,
+            default: null,
+        },
+        fromItem: {
+            type: Number,
+            default: null,
+        },
+        toItem: {
+            type: Number,
+            default: null,
+        },
+        totalItems: {
+            type: Number,
+            default: null,
+        },
+    });
+
+    defineEmits({
+        fetchNextPage: () => true,
+        fetchPreviousPage: () => true,
+        fetchPage: (page) => typeof page === 'number',
+    });
+</script>
+
+<template>
+    <div class="flex flex-col overflow-hidden rounded-xl bg-white shadow-sm ring-1 ring-gray-950/5">
+        <div v-if="heading" class="border-b border-gray-200 px-6 py-3">
+            <h3 class="text-sm font-semibold text-gray-950">{{ heading }}</h3>
+        </div>
+
+        <ul role="list" class="divide-y">
+            <slot />
+        </ul>
+
+        <Pagination
+            v-if="lastPage !== null && totalItems !== null"
+            :currentPage="currentPage"
+            :lastPage="lastPage"
+            :fromItem="fromItem"
+            :toItem="toItem"
+            :totalItems="totalItems"
+            @fetchNextPage="$emit('fetchNextPage')"
+            @fetchPreviousPage="$emit('fetchPreviousPage')"
+            @fetchPage="(page) => $emit('fetchPage', page)"
+        />
+
+        <slot name="footer" />
+    </div>
+</template>
diff --git a/resources/js/components/portal/ResourceListItem.vue b/resources/js/components/portal/ResourceListItem.vue
new file mode 100644
index 0000000..f036965
--- /dev/null
+++ b/resources/js/components/portal/ResourceListItem.vue
@@ -0,0 +1,71 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import { ChevronRightIcon } from '@heroicons/vue/20/solid';
+
+    defineProps({
+        to: {
+            type: [Object, String],
+            required: true,
+        },
+    });
+</script>
+
+<template>
+    <li>
+        <router-link
+            :to="to"
+            class="group flex items-center px-6 py-3 text-sm text-gray-700 transition duration-75 hover:bg-gray-50"
+        >
+            <div v-if="$slots.icon" class="mr-3 shrink-0">
+                <slot name="icon" />
+            </div>
+            <div class="flex-1 min-w-0">
+                <div class="flex items-baseline gap-2 flex-wrap">
+                    <span class="font-medium text-gray-950"><slot name="primary" /></span>
+                    <span v-if="$slots.secondary" class="text-gray-500 text-sm"><slot name="secondary" /></span>
+                </div>
+                <p v-if="$slots.description" class="mt-0.5 text-sm text-gray-500">
+                    <slot name="description" />
+                </p>
+            </div>
+            <div v-if="$slots.badge" class="ml-3 shrink-0">
+                <slot name="badge" />
+            </div>
+            <ChevronRightIcon
+                class="ml-2 shrink-0 size-5 text-gray-400 opacity-0 transition-all group-hover:translate-x-1 group-hover:opacity-100"
+            />
+        </router-link>
+    </li>
+</template>
diff --git a/resources/js/components/portal/Tabs.vue b/resources/js/components/portal/Tabs.vue
new file mode 100644
index 0000000..712b4d9
--- /dev/null
+++ b/resources/js/components/portal/Tabs.vue
@@ -0,0 +1,83 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    defineProps({
+        tabs: {
+            type: Array,
+            required: true,
+        },
+        modelValue: {
+            type: String,
+            required: true,
+        },
+        contained: {
+            type: Boolean,
+            default: false,
+        },
+    });
+
+    const emit = defineEmits(['update:modelValue']);
+</script>
+
+<template>
+    <nav
+        class="flex max-w-full gap-x-1 overflow-x-auto"
+        :class="
+            contained
+                ? 'border-b border-gray-200 px-3 py-2.5'
+                : 'rounded-xl bg-white p-2 shadow-sm ring-1 ring-gray-950/5'
+        "
+    >
+        <button
+            v-for="tab in tabs"
+            :key="tab.value"
+            type="button"
+            @click="emit('update:modelValue', tab.value)"
+            class="flex items-center justify-center gap-x-2 rounded-lg px-3 py-2 text-sm font-medium whitespace-nowrap transition duration-75 outline-none"
+            :class="modelValue === tab.value ? 'bg-gray-50' : 'hover:bg-gray-50 focus-visible:bg-gray-50'"
+        >
+            <component
+                v-if="tab.icon"
+                :is="tab.icon"
+                class="size-5 shrink-0 transition duration-75"
+                :class="modelValue === tab.value ? 'text-brand-600' : 'text-gray-400'"
+            />
+            <span
+                class="transition duration-75"
+                :class="modelValue === tab.value ? 'text-brand-700' : 'text-gray-500'"
+                >{{ tab.label }}</span
+            >
+        </button>
+    </nav>
+</template>
diff --git a/resources/js/components/portal/Tags.vue b/resources/js/components/portal/Tags.vue
new file mode 100644
index 0000000..9ec4aa1
--- /dev/null
+++ b/resources/js/components/portal/Tags.vue
@@ -0,0 +1,60 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import BaseBadge from '../BaseBadge.vue';
+
+    defineProps({
+        tags: {
+            type: Array,
+            default: () => [],
+        },
+        featured: {
+            type: Boolean,
+            default: false,
+        },
+        variant: {
+            type: String,
+            default: 'default',
+        },
+    });
+</script>
+
+<template>
+    <div class="flex flex-wrap gap-2">
+        <BaseBadge v-if="featured" :color="variant === 'hero' ? 'transparent-white' : 'gray'">Featured</BaseBadge>
+        <BaseBadge v-for="tag in tags" :key="tag.id" :color="variant === 'hero' ? 'transparent-white' : 'gray'">{{
+            tag.name
+        }}</BaseBadge>
+    </div>
+</template>
diff --git a/resources/js/components/portal/category/Article.vue b/resources/js/components/portal/category/Article.vue
new file mode 100644
index 0000000..3489ae0
--- /dev/null
+++ b/resources/js/components/portal/category/Article.vue
@@ -0,0 +1,65 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import { ChevronRightIcon } from '@heroicons/vue/20/solid/index.js';
+    import Tags from '../Tags.vue';
+
+    defineProps({
+        article: {
+            type: Object,
+            required: true,
+        },
+    });
+</script>
+
+<template>
+    <router-link
+        :to="{
+            name: 'view-article',
+            params: {
+                categoryId: article.categoryId,
+                articleId: article.id,
+            },
+        }"
+        class="group flex items-center gap-x-3 px-6 py-3 transition duration-75 hover:bg-gray-50"
+    >
+        <div class="flex-1 min-w-0 flex flex-col gap-y-1.5">
+            <span class="text-sm font-medium text-gray-700">{{ article.name }}</span>
+            <Tags :tags="article.tags" :featured="article.featured" />
+        </div>
+        <ChevronRightIcon
+            class="size-5 shrink-0 text-gray-400 opacity-0 transition-all group-hover:translate-x-1 group-hover:opacity-100"
+        />
+    </router-link>
+</template>
diff --git a/resources/js/components/portal/category/SearchResults.vue b/resources/js/components/portal/category/SearchResults.vue
new file mode 100644
index 0000000..f101560
--- /dev/null
+++ b/resources/js/components/portal/category/SearchResults.vue
@@ -0,0 +1,114 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import { DocumentTextIcon, FolderIcon } from '@heroicons/vue/24/outline';
+    import SearchLoading from '../home/SearchLoading.vue';
+    import Subheading from '../Subheading.vue';
+    import Article from './Article.vue';
+    import ResourceList from '../ResourceList.vue';
+    import ResourceListItem from '../ResourceListItem.vue';
+
+    defineProps({
+        searchQuery: {
+            type: String,
+            required: true,
+        },
+        searchResults: {
+            type: Object,
+            required: true,
+        },
+        loadingResults: {
+            type: Boolean,
+            required: true,
+        },
+    });
+</script>
+
+<template>
+    <div v-if="loadingResults">
+        <SearchLoading />
+    </div>
+
+    <div v-if="!loadingResults && searchResults?.data" class="flex flex-col gap-6">
+        <Subheading>
+            Search results<template v-if="searchQuery">
+                for <span class="text-gray-500">&ldquo;{{ searchQuery }}&rdquo;</span></template
+            >
+        </Subheading>
+
+        <div class="flex flex-col overflow-hidden rounded-xl bg-white shadow-sm ring-1 ring-gray-950/5">
+            <div v-if="searchResults.data.articles.length > 0">
+                <ul role="list" class="divide-y">
+                    <li v-for="article in searchResults.data.articles" :key="article.id">
+                        <Article :article="article" />
+                    </li>
+                </ul>
+            </div>
+
+            <section v-else class="px-6 py-4 flex items-start gap-x-4">
+                <div class="flex size-12 items-center justify-center rounded-full bg-gray-100">
+                    <DocumentTextIcon class="size-6 text-gray-400" />
+                </div>
+
+                <div class="flex-1">
+                    <h4 class="text-base font-semibold leading-6 text-gray-950">No articles found</h4>
+
+                    <p class="mt-1 text-sm text-gray-500">No articles match your current search criteria.</p>
+                </div>
+            </section>
+        </div>
+
+        <ResourceList v-if="searchResults.data.categories.length > 0" heading="Categories">
+            <ResourceListItem
+                v-for="category in searchResults.data.categories"
+                :key="category.id"
+                :to="{ name: 'view-category', params: { categoryId: category.id } }"
+            >
+                <template #primary>{{ category.name }}</template>
+            </ResourceListItem>
+        </ResourceList>
+
+        <section v-else class="rounded-xl bg-white shadow-sm ring-1 ring-gray-950/5 px-6 py-4 flex items-start gap-x-4">
+            <div class="flex size-12 items-center justify-center rounded-full bg-gray-100">
+                <FolderIcon class="size-6 text-gray-400" />
+            </div>
+
+            <div class="flex-1">
+                <h4 class="text-base font-semibold leading-6 text-gray-950">No categories found</h4>
+
+                <p class="mt-1 text-sm text-gray-500">No categories match your current search criteria.</p>
+            </div>
+        </section>
+    </div>
+</template>
diff --git a/resources/js/components/portal/category/SubCategories.vue b/resources/js/components/portal/category/SubCategories.vue
new file mode 100644
index 0000000..eb48d19
--- /dev/null
+++ b/resources/js/components/portal/category/SubCategories.vue
@@ -0,0 +1,62 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import CategoryCard from '../home/CategoryCard.vue';
+
+    defineProps({
+        subCategories: {
+            type: Object,
+            required: true,
+        },
+    });
+</script>
+
+<template>
+    <div class="grid gap-3 md:grid-cols-2">
+        <CategoryCard
+            v-for="subCategory in subCategories"
+            :key="subCategory.id"
+            :to="{
+                name: 'view-subcategory',
+                params: {
+                    parentCategoryId: subCategory.parentCategory.id,
+                    categoryId: subCategory.id,
+                },
+            }"
+            :icon="subCategory.icon"
+            :name="subCategory.name"
+            :description="subCategory.description"
+        />
+    </div>
+</template>

From 78f7809ac87509e640fd79472e7cfb36683b5d9e Mon Sep 17 00:00:00 2001
From: nency-canyon <nency.bhadeshiya@canyongbs.com>
Date: Fri, 3 Jul 2026 22:14:28 +0530
Subject: [PATCH 3/8] feat: add portal article components including loading,
 empty state, page card, article content, feedback, and meta

---
 resources/js/components/portal/AppLoading.vue | 42 +++++++++
 resources/js/components/portal/EmptyState.vue | 71 +++++++++++++++
 resources/js/components/portal/PageCard.vue   | 38 ++++++++
 .../portal/article/ArticleAttachments.vue     | 62 +++++++++++++
 .../portal/article/ArticleContent.vue         | 72 +++++++++++++++
 .../portal/article/ArticleFeedback.vue        | 89 +++++++++++++++++++
 .../components/portal/article/ArticleMeta.vue | 60 +++++++++++++
 7 files changed, 434 insertions(+)
 create mode 100644 resources/js/components/portal/AppLoading.vue
 create mode 100644 resources/js/components/portal/EmptyState.vue
 create mode 100644 resources/js/components/portal/PageCard.vue
 create mode 100644 resources/js/components/portal/article/ArticleAttachments.vue
 create mode 100644 resources/js/components/portal/article/ArticleContent.vue
 create mode 100644 resources/js/components/portal/article/ArticleFeedback.vue
 create mode 100644 resources/js/components/portal/article/ArticleMeta.vue

diff --git a/resources/js/components/portal/AppLoading.vue b/resources/js/components/portal/AppLoading.vue
new file mode 100644
index 0000000..c436352
--- /dev/null
+++ b/resources/js/components/portal/AppLoading.vue
@@ -0,0 +1,42 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import LoadingSpinner from '../LoadingSpinner.vue';
+</script>
+
+<template>
+    <div class="h-screen flex items-center justify-center">
+        <LoadingSpinner label="Loading Resource Hub..." />
+    </div>
+</template>
diff --git a/resources/js/components/portal/EmptyState.vue b/resources/js/components/portal/EmptyState.vue
new file mode 100644
index 0000000..149dd6c
--- /dev/null
+++ b/resources/js/components/portal/EmptyState.vue
@@ -0,0 +1,71 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import { XMarkIcon } from '@heroicons/vue/24/outline/index.js';
+
+    defineProps({
+        icon: {
+            type: Object,
+            default: null,
+        },
+        contained: {
+            type: Boolean,
+            default: true,
+        },
+    });
+</script>
+
+<template>
+    <section class="px-6 py-12" :class="contained && 'rounded-xl bg-white shadow-sm ring-1 ring-gray-950/5'">
+        <div class="mx-auto grid max-w-lg justify-items-center text-center">
+            <div class="mb-4 flex size-12 items-center justify-center rounded-full bg-gray-100">
+                <component :is="icon || XMarkIcon" class="size-6 text-gray-400" />
+            </div>
+
+            <div class="grid justify-items-center text-center">
+                <h4 class="text-base font-semibold leading-6 text-gray-950">
+                    <slot name="heading" />
+                </h4>
+
+                <p v-if="$slots.description" class="mt-1 text-sm text-gray-500">
+                    <slot name="description" />
+                </p>
+
+                <div v-if="$slots.actions" class="mt-6">
+                    <slot name="actions" />
+                </div>
+            </div>
+        </div>
+    </section>
+</template>
diff --git a/resources/js/components/portal/PageCard.vue b/resources/js/components/portal/PageCard.vue
new file mode 100644
index 0000000..640e39b
--- /dev/null
+++ b/resources/js/components/portal/PageCard.vue
@@ -0,0 +1,38 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<template>
+    <div class="bg-white ring-1 ring-gray-950/5 shadow-xs rounded-xl px-6 py-4 flex flex-col gap-y-6">
+        <slot />
+    </div>
+</template>
diff --git a/resources/js/components/portal/article/ArticleAttachments.vue b/resources/js/components/portal/article/ArticleAttachments.vue
new file mode 100644
index 0000000..ab730a1
--- /dev/null
+++ b/resources/js/components/portal/article/ArticleAttachments.vue
@@ -0,0 +1,62 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import { PaperClipIcon } from '@heroicons/vue/20/solid';
+
+    defineProps({
+        attachments: {
+            type: Array,
+            required: true,
+        },
+    });
+</script>
+
+<template>
+    <div class="max-w-5xl w-full mx-auto">
+        <h3 class="text-lg font-semibold text-gray-900 mb-3">Article Resources</h3>
+        <div class="divide-y divide-gray-200">
+            <div v-for="(attachment, index) in attachments" :key="index" class="flex items-center gap-x-3 py-3">
+                <PaperClipIcon class="size-5 shrink-0 text-gray-400" aria-hidden="true" />
+                <a
+                    :href="attachment.url"
+                    class="text-sm font-medium text-brand-600 hover:text-brand-500 underline"
+                    target="_blank"
+                    rel="noopener noreferrer"
+                >
+                    {{ attachment.name }}
+                </a>
+            </div>
+        </div>
+    </div>
+</template>
diff --git a/resources/js/components/portal/article/ArticleContent.vue b/resources/js/components/portal/article/ArticleContent.vue
new file mode 100644
index 0000000..b0f0854
--- /dev/null
+++ b/resources/js/components/portal/article/ArticleContent.vue
@@ -0,0 +1,72 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import DOMPurify from 'dompurify';
+
+    defineProps({
+        content: {
+            type: String,
+            required: true,
+        },
+    });
+</script>
+
+<template>
+    <div
+        class="prose max-w-5xl w-full mx-auto prose-p:leading-snug! prose-p:my-2.5! prose-headings:my-4! prose-hr:my-5! prose-ul:my-3! prose-ol:my-3! prose-li:my-0! [&_li>p]:my-1! [&_td_p]:my-3! [&_th_p]:my-3! prose-table:w-full! prose-table:my-6 prose-table:border-separate prose-table:border-spacing-0 prose-table:rounded-lg prose-table:border prose-table:border-gray-200 prose-table:overflow-hidden prose-table:shadow-xs prose-td:border-b prose-td:border-gray-100 prose-td:align-middle prose-td:px-6 prose-td:py-2 prose-td:text-left prose-td:text-gray-700 prose-th:border-none prose-th:bg-brand-600 prose-th:px-6 prose-th:py-2 prose-th:text-left prose-th:font-bold prose-th:text-white [&_tr:last-child_td]:border-b-[3px]! [&_tr:last-child_td]:border-brand-600! even:prose-tr:bg-gray-50"
+        v-html="
+            DOMPurify.sanitize(content, {
+                ADD_TAGS: ['iframe', 'video', 'source'],
+                ADD_ATTR: [
+                    'allow',
+                    'allowfullscreen',
+                    'frameborder',
+                    'controls',
+                    'target',
+                    'rel',
+                    'data-video-embed',
+                    'data-video-type',
+                    'data-video-src',
+                    'data-video-width',
+                    'data-video-height',
+                    'data-cols',
+                    'data-col-span',
+                    'data-from-breakpoint',
+                    'data-color',
+                    'data-id',
+                ],
+            })
+        "
+    ></div>
+</template>
diff --git a/resources/js/components/portal/article/ArticleFeedback.vue b/resources/js/components/portal/article/ArticleFeedback.vue
new file mode 100644
index 0000000..5d55051
--- /dev/null
+++ b/resources/js/components/portal/article/ArticleFeedback.vue
@@ -0,0 +1,89 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import { HandThumbDownIcon, HandThumbUpIcon } from '@heroicons/vue/24/solid';
+
+    defineProps({
+        feedback: {
+            type: Boolean,
+            default: null,
+        },
+        helpfulVotePercentage: {
+            type: Number,
+            default: null,
+        },
+    });
+
+    const emit = defineEmits(['toggle-feedback']);
+</script>
+
+<template>
+    <div class="max-w-5xl mx-auto w-full flex flex-wrap items-center gap-4 border border-gray-200 rounded-lg p-4 bg-white">
+        <span class="text-sm font-medium text-gray-700">Was this content helpful?</span>
+
+        <div class="flex items-center gap-2">
+            <button
+                type="button"
+                @click="emit('toggle-feedback', true)"
+                class="relative inline-grid grid-flow-col items-center justify-center gap-1.5 rounded-lg px-3 py-2 text-sm font-medium outline-none transition duration-75 focus-visible:ring-2"
+                :class="
+                    feedback === true
+                        ? 'bg-brand-600 text-white hover:bg-brand-500 focus-visible:ring-brand-500/50'
+                        : 'bg-white text-gray-950 ring-1 ring-gray-950/10 hover:bg-gray-50'
+                "
+            >
+                <HandThumbUpIcon class="size-5" />
+                Yes
+            </button>
+
+            <button
+                type="button"
+                @click="emit('toggle-feedback', false)"
+                class="relative inline-grid grid-flow-col items-center justify-center gap-1.5 rounded-lg px-3 py-2 text-sm font-medium outline-none transition duration-75 focus-visible:ring-2"
+                :class="
+                    feedback === false
+                        ? 'bg-brand-600 text-white hover:bg-brand-500 focus-visible:ring-brand-500/50'
+                        : 'bg-white text-gray-950 ring-1 ring-gray-950/10 hover:bg-gray-50'
+                "
+            >
+                <HandThumbDownIcon class="size-5" />
+                No
+            </button>
+        </div>
+
+        <span v-if="helpfulVotePercentage" class="text-sm text-gray-500">
+            {{ helpfulVotePercentage }}% of visitors found this helpful.
+        </span>
+    </div>
+</template>
diff --git a/resources/js/components/portal/article/ArticleMeta.vue b/resources/js/components/portal/article/ArticleMeta.vue
new file mode 100644
index 0000000..dbddf0c
--- /dev/null
+++ b/resources/js/components/portal/article/ArticleMeta.vue
@@ -0,0 +1,60 @@
+<!--
+<COPYRIGHT>
+
+    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
+
+    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
+    see https://github.com/canyongbs/common/blob/main/LICENSE.
+
+    Notice:
+
+    - You may not provide the software to third parties as a hosted or managed
+      service, where the service provides users with access to any substantial set of
+      the features or functionality of the software.
+    - You may not move, change, disable, or circumvent the license key functionality
+      in the software, and you may not remove or obscure any functionality in the
+      software that is protected by the license key.
+    - You may not alter, remove, or obscure any licensing, copyright, or other notices
+      of the licensor in the software. Any use of the licensor's trademarks is subject
+      to applicable law.
+    - Canyon GBS LLC respects the intellectual property rights of others and expects the
+      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
+      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
+      vigorously.
+    - The software solution, including services, infrastructure, and code, is offered as a
+      Software as a Service (SaaS) by Canyon GBS LLC.
+    - Use of this software implies agreement to the license terms and conditions as stated
+      in the Elastic License 2.0.
+
+    For more information or inquiries please visit our website at
+    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
+
+</COPYRIGHT>
+-->
+<script setup>
+    import { ClockIcon, EyeIcon } from '@heroicons/vue/20/solid';
+
+    defineProps({
+        viewCount: {
+            type: Number,
+            required: true,
+        },
+        lastUpdated: {
+            type: String,
+            required: true,
+        },
+    });
+</script>
+
+<template>
+    <div class="flex flex-col sm:flex-row sm:items-center gap-y-1 gap-x-4">
+        <div class="flex items-center gap-x-1.5">
+            <EyeIcon class="size-4 shrink-0" aria-hidden="true" />
+            <span>{{ viewCount }} Views</span>
+        </div>
+        <div class="flex items-center gap-x-1.5">
+            <ClockIcon class="size-4 shrink-0" aria-hidden="true" />
+            <span>Last updated: {{ lastUpdated }}</span>
+        </div>
+    </div>
+</template>

From 225b6004b41037756e299c6b032c53561c7821f3 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]" <github-actions[bot]@users.noreply.github.com>
Date: Fri, 3 Jul 2026 16:47:54 +0000
Subject: [PATCH 4/8] chore: fix enforcement of copyright on all files

---
 resources/js/components/portal/AppLoading.vue                 | 2 +-
 resources/js/components/portal/Breadcrumbs.vue                | 2 +-
 resources/js/components/portal/EmptyState.vue                 | 2 +-
 resources/js/components/portal/HeroSearch.vue                 | 2 +-
 resources/js/components/portal/Page.vue                       | 2 +-
 resources/js/components/portal/PageCard.vue                   | 2 +-
 resources/js/components/portal/Pagination.vue                 | 2 +-
 resources/js/components/portal/ResourceList.vue               | 2 +-
 resources/js/components/portal/ResourceListItem.vue           | 2 +-
 resources/js/components/portal/Subheading.vue                 | 2 +-
 resources/js/components/portal/Tabs.vue                       | 2 +-
 resources/js/components/portal/Tags.vue                       | 2 +-
 resources/js/components/portal/article/ArticleAttachments.vue | 2 +-
 resources/js/components/portal/article/ArticleContent.vue     | 2 +-
 resources/js/components/portal/article/ArticleFeedback.vue    | 2 +-
 resources/js/components/portal/article/ArticleMeta.vue        | 2 +-
 resources/js/components/portal/category/Article.vue           | 2 +-
 resources/js/components/portal/category/SearchResults.vue     | 2 +-
 resources/js/components/portal/category/SubCategories.vue     | 2 +-
 resources/js/components/portal/home/CategoryCard.vue          | 2 +-
 resources/js/components/portal/home/HelpCenter.vue            | 2 +-
 resources/js/components/portal/home/HeroSearch.vue            | 2 +-
 resources/js/components/portal/home/SearchLoading.vue         | 2 +-
 resources/js/components/portal/home/SearchResults.vue         | 2 +-
 24 files changed, 24 insertions(+), 24 deletions(-)

diff --git a/resources/js/components/portal/AppLoading.vue b/resources/js/components/portal/AppLoading.vue
index c436352..d6d8612 100644
--- a/resources/js/components/portal/AppLoading.vue
+++ b/resources/js/components/portal/AppLoading.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/Breadcrumbs.vue b/resources/js/components/portal/Breadcrumbs.vue
index c02b5ba..85b2388 100644
--- a/resources/js/components/portal/Breadcrumbs.vue
+++ b/resources/js/components/portal/Breadcrumbs.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/EmptyState.vue b/resources/js/components/portal/EmptyState.vue
index 149dd6c..1579dfe 100644
--- a/resources/js/components/portal/EmptyState.vue
+++ b/resources/js/components/portal/EmptyState.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/HeroSearch.vue b/resources/js/components/portal/HeroSearch.vue
index f5710cb..c2558f0 100644
--- a/resources/js/components/portal/HeroSearch.vue
+++ b/resources/js/components/portal/HeroSearch.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/Page.vue b/resources/js/components/portal/Page.vue
index 0fa9475..6908633 100644
--- a/resources/js/components/portal/Page.vue
+++ b/resources/js/components/portal/Page.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/PageCard.vue b/resources/js/components/portal/PageCard.vue
index 640e39b..3dbbd87 100644
--- a/resources/js/components/portal/PageCard.vue
+++ b/resources/js/components/portal/PageCard.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/Pagination.vue b/resources/js/components/portal/Pagination.vue
index 219a1d4..a0a12de 100644
--- a/resources/js/components/portal/Pagination.vue
+++ b/resources/js/components/portal/Pagination.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/ResourceList.vue b/resources/js/components/portal/ResourceList.vue
index e2d4e2c..1a36906 100644
--- a/resources/js/components/portal/ResourceList.vue
+++ b/resources/js/components/portal/ResourceList.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/ResourceListItem.vue b/resources/js/components/portal/ResourceListItem.vue
index f036965..cfa0a32 100644
--- a/resources/js/components/portal/ResourceListItem.vue
+++ b/resources/js/components/portal/ResourceListItem.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/Subheading.vue b/resources/js/components/portal/Subheading.vue
index 0c0ee42..4ceaa54 100644
--- a/resources/js/components/portal/Subheading.vue
+++ b/resources/js/components/portal/Subheading.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/Tabs.vue b/resources/js/components/portal/Tabs.vue
index 712b4d9..df241cc 100644
--- a/resources/js/components/portal/Tabs.vue
+++ b/resources/js/components/portal/Tabs.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/Tags.vue b/resources/js/components/portal/Tags.vue
index 9ec4aa1..2f9c982 100644
--- a/resources/js/components/portal/Tags.vue
+++ b/resources/js/components/portal/Tags.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/article/ArticleAttachments.vue b/resources/js/components/portal/article/ArticleAttachments.vue
index ab730a1..fc47b44 100644
--- a/resources/js/components/portal/article/ArticleAttachments.vue
+++ b/resources/js/components/portal/article/ArticleAttachments.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/article/ArticleContent.vue b/resources/js/components/portal/article/ArticleContent.vue
index b0f0854..f4b2c4b 100644
--- a/resources/js/components/portal/article/ArticleContent.vue
+++ b/resources/js/components/portal/article/ArticleContent.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/article/ArticleFeedback.vue b/resources/js/components/portal/article/ArticleFeedback.vue
index 5d55051..0fd8826 100644
--- a/resources/js/components/portal/article/ArticleFeedback.vue
+++ b/resources/js/components/portal/article/ArticleFeedback.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/article/ArticleMeta.vue b/resources/js/components/portal/article/ArticleMeta.vue
index dbddf0c..c712ff7 100644
--- a/resources/js/components/portal/article/ArticleMeta.vue
+++ b/resources/js/components/portal/article/ArticleMeta.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/category/Article.vue b/resources/js/components/portal/category/Article.vue
index 3489ae0..5f15521 100644
--- a/resources/js/components/portal/category/Article.vue
+++ b/resources/js/components/portal/category/Article.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/category/SearchResults.vue b/resources/js/components/portal/category/SearchResults.vue
index f101560..923c2be 100644
--- a/resources/js/components/portal/category/SearchResults.vue
+++ b/resources/js/components/portal/category/SearchResults.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/category/SubCategories.vue b/resources/js/components/portal/category/SubCategories.vue
index eb48d19..35becbe 100644
--- a/resources/js/components/portal/category/SubCategories.vue
+++ b/resources/js/components/portal/category/SubCategories.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/home/CategoryCard.vue b/resources/js/components/portal/home/CategoryCard.vue
index 7cfdc2e..3b9f0eb 100644
--- a/resources/js/components/portal/home/CategoryCard.vue
+++ b/resources/js/components/portal/home/CategoryCard.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/home/HelpCenter.vue b/resources/js/components/portal/home/HelpCenter.vue
index 0bacedb..1b34193 100644
--- a/resources/js/components/portal/home/HelpCenter.vue
+++ b/resources/js/components/portal/home/HelpCenter.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/home/HeroSearch.vue b/resources/js/components/portal/home/HeroSearch.vue
index 3c1a2ee..1599e35 100644
--- a/resources/js/components/portal/home/HeroSearch.vue
+++ b/resources/js/components/portal/home/HeroSearch.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/home/SearchLoading.vue b/resources/js/components/portal/home/SearchLoading.vue
index 0c78292..f7a9486 100644
--- a/resources/js/components/portal/home/SearchLoading.vue
+++ b/resources/js/components/portal/home/SearchLoading.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
diff --git a/resources/js/components/portal/home/SearchResults.vue b/resources/js/components/portal/home/SearchResults.vue
index 7ead34f..386a165 100644
--- a/resources/js/components/portal/home/SearchResults.vue
+++ b/resources/js/components/portal/home/SearchResults.vue
@@ -15,7 +15,7 @@
       in the software, and you may not remove or obscure any functionality in the
       software that is protected by the license key.
     - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
+      of the licensor in the software. Any use of the licensor’s trademarks is subject
       to applicable law.
     - Canyon GBS LLC respects the intellectual property rights of others and expects the
       same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of

From 5e38cc31f71f0dbb2bdd0fa25878bae52a700418 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]" <github-actions[bot]@users.noreply.github.com>
Date: Fri, 3 Jul 2026 16:48:53 +0000
Subject: [PATCH 5/8] chore: fix code style

---
 resources/js/components/portal/article/ArticleFeedback.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/resources/js/components/portal/article/ArticleFeedback.vue b/resources/js/components/portal/article/ArticleFeedback.vue
index 0fd8826..f64c734 100644
--- a/resources/js/components/portal/article/ArticleFeedback.vue
+++ b/resources/js/components/portal/article/ArticleFeedback.vue
@@ -49,7 +49,9 @@
 </script>
 
 <template>
-    <div class="max-w-5xl mx-auto w-full flex flex-wrap items-center gap-4 border border-gray-200 rounded-lg p-4 bg-white">
+    <div
+        class="max-w-5xl mx-auto w-full flex flex-wrap items-center gap-4 border border-gray-200 rounded-lg p-4 bg-white"
+    >
         <span class="text-sm font-medium text-gray-700">Was this content helpful?</span>
 
         <div class="flex items-center gap-2">

From 3c1c5ca6ae2db4bff246dae6bfc29fa1082d9f9b Mon Sep 17 00:00:00 2001
From: nency-canyon <nency.bhadeshiya@canyongbs.com>
Date: Tue, 7 Jul 2026 23:10:44 +0530
Subject: [PATCH 6/8] fix: remove out-of-scope home/ components and fix
 app-specific routing in category components

---
 .../js/components/portal/category/Article.vue |  31 +++--
 .../portal/category/SearchResults.vue         |  43 +++---
 .../portal/category/SubCategories.vue         |  12 +-
 .../js/components/portal/home/HeroSearch.vue  |  94 -------------
 .../components/portal/home/SearchResults.vue  | 129 ------------------
 5 files changed, 47 insertions(+), 262 deletions(-)
 delete mode 100644 resources/js/components/portal/home/HeroSearch.vue
 delete mode 100644 resources/js/components/portal/home/SearchResults.vue

diff --git a/resources/js/components/portal/category/Article.vue b/resources/js/components/portal/category/Article.vue
index 3489ae0..cb9e98a 100644
--- a/resources/js/components/portal/category/Article.vue
+++ b/resources/js/components/portal/category/Article.vue
@@ -36,27 +36,30 @@
     import Tags from '../Tags.vue';
 
     defineProps({
-        article: {
-            type: Object,
+        to: {
+            type: [Object, String],
             required: true,
         },
+        name: {
+            type: String,
+            required: true,
+        },
+        tags: {
+            type: Array,
+            default: () => [],
+        },
+        featured: {
+            type: Boolean,
+            default: false,
+        },
     });
 </script>
 
 <template>
-    <router-link
-        :to="{
-            name: 'view-article',
-            params: {
-                categoryId: article.categoryId,
-                articleId: article.id,
-            },
-        }"
-        class="group flex items-center gap-x-3 px-6 py-3 transition duration-75 hover:bg-gray-50"
-    >
+    <router-link :to="to" class="group flex items-center gap-x-3 px-6 py-3 transition duration-75 hover:bg-gray-50">
         <div class="flex-1 min-w-0 flex flex-col gap-y-1.5">
-            <span class="text-sm font-medium text-gray-700">{{ article.name }}</span>
-            <Tags :tags="article.tags" :featured="article.featured" />
+            <span class="text-sm font-medium text-gray-700">{{ name }}</span>
+            <Tags :tags="tags" :featured="featured" />
         </div>
         <ChevronRightIcon
             class="size-5 shrink-0 text-gray-400 opacity-0 transition-all group-hover:translate-x-1 group-hover:opacity-100"
diff --git a/resources/js/components/portal/category/SearchResults.vue b/resources/js/components/portal/category/SearchResults.vue
index f101560..7dc5803 100644
--- a/resources/js/components/portal/category/SearchResults.vue
+++ b/resources/js/components/portal/category/SearchResults.vue
@@ -44,14 +44,26 @@
             type: String,
             required: true,
         },
-        searchResults: {
-            type: Object,
-            required: true,
+        articles: {
+            type: Array,
+            default: () => [],
+        },
+        categories: {
+            type: Array,
+            default: () => [],
         },
         loadingResults: {
             type: Boolean,
             required: true,
         },
+        hasResults: {
+            type: Boolean,
+            default: false,
+        },
+        label: {
+            type: String,
+            default: null,
+        },
     });
 </script>
 
@@ -60,18 +72,21 @@
         <SearchLoading />
     </div>
 
-    <div v-if="!loadingResults && searchResults?.data" class="flex flex-col gap-6">
+    <div v-if="!loadingResults && hasResults" class="flex flex-col gap-6">
         <Subheading>
-            Search results<template v-if="searchQuery">
-                for <span class="text-gray-500">&ldquo;{{ searchQuery }}&rdquo;</span></template
-            >
+            <template v-if="label">{{ label }}</template>
+            <template v-else>
+                Search results<template v-if="searchQuery">
+                    for <span class="text-gray-500">&ldquo;{{ searchQuery }}&rdquo;</span></template
+                >
+            </template>
         </Subheading>
 
         <div class="flex flex-col overflow-hidden rounded-xl bg-white shadow-sm ring-1 ring-gray-950/5">
-            <div v-if="searchResults.data.articles.length > 0">
+            <div v-if="articles.length > 0">
                 <ul role="list" class="divide-y">
-                    <li v-for="article in searchResults.data.articles" :key="article.id">
-                        <Article :article="article" />
+                    <li v-for="article in articles" :key="article.key">
+                        <Article :to="article.to" :name="article.name" :tags="article.tags" :featured="article.featured" />
                     </li>
                 </ul>
             </div>
@@ -89,12 +104,8 @@
             </section>
         </div>
 
-        <ResourceList v-if="searchResults.data.categories.length > 0" heading="Categories">
-            <ResourceListItem
-                v-for="category in searchResults.data.categories"
-                :key="category.id"
-                :to="{ name: 'view-category', params: { categoryId: category.id } }"
-            >
+        <ResourceList v-if="categories.length > 0" heading="Categories">
+            <ResourceListItem v-for="category in categories" :key="category.key" :to="category.to">
                 <template #primary>{{ category.name }}</template>
             </ResourceListItem>
         </ResourceList>
diff --git a/resources/js/components/portal/category/SubCategories.vue b/resources/js/components/portal/category/SubCategories.vue
index eb48d19..085c264 100644
--- a/resources/js/components/portal/category/SubCategories.vue
+++ b/resources/js/components/portal/category/SubCategories.vue
@@ -36,7 +36,7 @@
 
     defineProps({
         subCategories: {
-            type: Object,
+            type: Array,
             required: true,
         },
     });
@@ -46,14 +46,8 @@
     <div class="grid gap-3 md:grid-cols-2">
         <CategoryCard
             v-for="subCategory in subCategories"
-            :key="subCategory.id"
-            :to="{
-                name: 'view-subcategory',
-                params: {
-                    parentCategoryId: subCategory.parentCategory.id,
-                    categoryId: subCategory.id,
-                },
-            }"
+            :key="subCategory.key"
+            :to="subCategory.to"
             :icon="subCategory.icon"
             :name="subCategory.name"
             :description="subCategory.description"
diff --git a/resources/js/components/portal/home/HeroSearch.vue b/resources/js/components/portal/home/HeroSearch.vue
deleted file mode 100644
index 3c1a2ee..0000000
--- a/resources/js/components/portal/home/HeroSearch.vue
+++ /dev/null
@@ -1,94 +0,0 @@
-<!--
-<COPYRIGHT>
-
-    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
-
-    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
-    see https://github.com/canyongbs/common/blob/main/LICENSE.
-
-    Notice:
-
-    - You may not provide the software to third parties as a hosted or managed
-      service, where the service provides users with access to any substantial set of
-      the features or functionality of the software.
-    - You may not move, change, disable, or circumvent the license key functionality
-      in the software, and you may not remove or obscure any functionality in the
-      software that is protected by the license key.
-    - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
-      to applicable law.
-    - Canyon GBS LLC respects the intellectual property rights of others and expects the
-      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
-      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
-      vigorously.
-    - The software solution, including services, infrastructure, and code, is offered as a
-      Software as a Service (SaaS) by Canyon GBS LLC.
-    - Use of this software implies agreement to the license terms and conditions as stated
-      in the Elastic License 2.0.
-
-    For more information or inquiries please visit our website at
-    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
-
-</COPYRIGHT>
--->
-<script setup>
-    import { Bars3Icon, MagnifyingGlassIcon } from '@heroicons/vue/24/outline';
-    import { computed } from 'vue';
-
-    const props = defineProps({
-        modelValue: {
-            type: [String, null],
-            default: null,
-        },
-    });
-
-    const emit = defineEmits(['update:modelValue', 'sidebarOpened']);
-
-    const searchQuery = computed({
-        get() {
-            return props.modelValue;
-        },
-        set(value) {
-            emit('update:modelValue', value);
-        },
-    });
-</script>
-
-<template>
-    <div class="sticky top-0 z-40 bg-gray-50 lg:hidden">
-        <button class="w-full p-3" type="button" @click="emit('sidebarOpened')">
-            <span class="sr-only">Open sidebar</span>
-
-            <Bars3Icon class="h-6 w-6 text-gray-900"></Bars3Icon>
-        </button>
-    </div>
-
-    <div
-        class="bg-[linear-gradient(to_right_bottom,rgba(var(--primary-500),1),rgba(var(--primary-800),1))] w-full px-6"
-    >
-        <div class="max-w-screen-xl flex flex-col gap-y-6 mx-auto py-8">
-            <div class="flex flex-col gap-y-1 text-left">
-                <h3 class="text-3xl font-semibold text-white">Need help?</h3>
-                <p class="text-primary-100">Search our resource hub for advice and answers</p>
-            </div>
-
-            <form action="#" method="GET">
-                <label for="search" class="sr-only">Search</label>
-
-                <div class="relative rounded">
-                    <div class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-4">
-                        <MagnifyingGlassIcon class="h-5 w-5 text-gray-400" aria-hidden="true" />
-                    </div>
-
-                    <input
-                        id="search"
-                        v-model="searchQuery"
-                        type="search"
-                        placeholder="Search for articles and categories"
-                        class="block w-full rounded border-0 py-3 pl-12 text-gray-900 ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-primary-200 sm:text-sm sm:leading-6"
-                    />
-                </div>
-            </form>
-        </div>
-    </div>
-</template>
diff --git a/resources/js/components/portal/home/SearchResults.vue b/resources/js/components/portal/home/SearchResults.vue
deleted file mode 100644
index 7ead34f..0000000
--- a/resources/js/components/portal/home/SearchResults.vue
+++ /dev/null
@@ -1,129 +0,0 @@
-<!--
-<COPYRIGHT>
-
-    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
-
-    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
-    see https://github.com/canyongbs/common/blob/main/LICENSE.
-
-    Notice:
-
-    - You may not provide the software to third parties as a hosted or managed
-      service, where the service provides users with access to any substantial set of
-      the features or functionality of the software.
-    - You may not move, change, disable, or circumvent the license key functionality
-      in the software, and you may not remove or obscure any functionality in the
-      software that is protected by the license key.
-    - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor's trademarks is subject
-      to applicable law.
-    - Canyon GBS LLC respects the intellectual property rights of others and expects the
-      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
-      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
-      vigorously.
-    - The software solution, including services, infrastructure, and code, is offered as a
-      Software as a Service (SaaS) by Canyon GBS LLC.
-    - Use of this software implies agreement to the license terms and conditions as stated
-      in the Elastic License 2.0.
-
-    For more information or inquiries please visit our website at
-    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
-
-</COPYRIGHT>
--->
-<script setup>
-    import { ChevronRightIcon, XMarkIcon } from '@heroicons/vue/20/solid';
-    import SearchLoading from './SearchLoading.vue';
-
-    defineProps({
-        searchQuery: {
-            type: String,
-            required: true,
-        },
-        searchResults: {
-            type: Object,
-            required: true,
-        },
-        loadingResults: {
-            type: Boolean,
-            required: true,
-        },
-    });
-</script>
-
-<template>
-    <div v-if="loadingResults">
-        <SearchLoading />
-    </div>
-
-    <div v-if="!loadingResults && searchResults?.data" class="flex flex-col gap-6">
-        <h3 class="text-2xl font-bold text-primary-950">
-            Search results: <span class="font-normal">{{ searchQuery }}</span>
-        </h3>
-
-        <div
-            class="flex flex-col divide-y divide-gray-200 ring-1 ring-black/5 shadow-xs px-3 pt-3 pb-1 rounded bg-white"
-        >
-            <h4 class="text-lg font-semibold text-gray-800 px-3 pt-1 pb-3">
-                Articles ({{ searchResults.data.articles.length }})
-            </h4>
-
-            <div v-if="searchResults.data.articles.length > 0">
-                <ul role="list" class="divide-y divide-gray-200">
-                    <li v-for="article in searchResults.data.articles" :key="article.id">
-                        <router-link
-                            :to="{
-                                name: 'view-article',
-                                params: { categoryId: article.categoryId, articleId: article.id },
-                            }"
-                            class="group p-3 flex items-start text-sm font-medium text-gray-700"
-                        >
-                            <h5>
-                                {{ article.name }}
-                            </h5>
-
-                            <ChevronRightIcon
-                                class="opacity-0 h-5 w-5 text-primary-600 transition-all group-hover:translate-x-2 group-hover:opacity-100"
-                            />
-                        </router-link>
-                    </li>
-                </ul>
-            </div>
-            <div v-else class="p-3 flex items-start gap-2">
-                <XMarkIcon class="h-5 w-5 text-gray-400" />
-
-                <p class="text-gray-600 text-sm font-medium">No articles found that match this search.</p>
-            </div>
-        </div>
-
-        <div
-            class="flex flex-col divide-y divide-gray-200 ring-1 ring-black/5 shadow-xs px-3 pt-3 pb-1 rounded bg-white"
-        >
-            <h4 class="text-lg font-semibold text-gray-800 px-3 pt-1 pb-3">Categories</h4>
-
-            <div v-if="searchResults.data.categories.length > 0">
-                <ul role="list" class="divide-y divide-gray-200">
-                    <li v-for="category in searchResults.data.categories" :key="category.id">
-                        <router-link
-                            :to="{ name: 'view-category', params: { categoryId: category.id } }"
-                            class="group p-3 flex items-start text-sm font-medium text-gray-700"
-                        >
-                            <h5>
-                                {{ category.name }}
-                            </h5>
-
-                            <ChevronRightIcon
-                                class="opacity-0 h-5 w-5 text-primary-600 transition-all group-hover:translate-x-2 group-hover:opacity-100"
-                            />
-                        </router-link>
-                    </li>
-                </ul>
-            </div>
-            <div v-else class="p-3 flex items-start gap-2">
-                <XMarkIcon class="h-5 w-5 text-gray-400" />
-
-                <p class="text-gray-600 text-sm font-medium">No categories found that match this search.</p>
-            </div>
-        </div>
-    </div>
-</template>

From 2d0cb2fbdbb5981b9d0b1628541fee85c4060e96 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]" <github-actions[bot]@users.noreply.github.com>
Date: Tue, 7 Jul 2026 17:44:38 +0000
Subject: [PATCH 7/8] chore: fix code style

---
 resources/js/components/portal/category/SearchResults.vue | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/resources/js/components/portal/category/SearchResults.vue b/resources/js/components/portal/category/SearchResults.vue
index 742e568..cf8d0d1 100644
--- a/resources/js/components/portal/category/SearchResults.vue
+++ b/resources/js/components/portal/category/SearchResults.vue
@@ -86,7 +86,12 @@
             <div v-if="articles.length > 0">
                 <ul role="list" class="divide-y">
                     <li v-for="article in articles" :key="article.key">
-                        <Article :to="article.to" :name="article.name" :tags="article.tags" :featured="article.featured" />
+                        <Article
+                            :to="article.to"
+                            :name="article.name"
+                            :tags="article.tags"
+                            :featured="article.featured"
+                        />
                     </li>
                 </ul>
             </div>

From c2f39c30b25247cf26b7a284d57cb28810a036ca Mon Sep 17 00:00:00 2001
From: nency-canyon <nency.bhadeshiya@canyongbs.com>
Date: Wed, 8 Jul 2026 22:20:32 +0530
Subject: [PATCH 8/8] feat: add customizable loading label to AppLoading
 component and remove unused components

---
 resources/js/components/portal/AppLoading.vue |   9 +-
 .../portal/category/SearchResults.vue         | 130 ------------------
 .../components/portal/home/CategoryCard.vue   |  80 -----------
 .../components/portal/home/SearchLoading.vue  |  40 ------
 4 files changed, 8 insertions(+), 251 deletions(-)
 delete mode 100644 resources/js/components/portal/category/SearchResults.vue
 delete mode 100644 resources/js/components/portal/home/CategoryCard.vue
 delete mode 100644 resources/js/components/portal/home/SearchLoading.vue

diff --git a/resources/js/components/portal/AppLoading.vue b/resources/js/components/portal/AppLoading.vue
index d6d8612..ce22e3d 100644
--- a/resources/js/components/portal/AppLoading.vue
+++ b/resources/js/components/portal/AppLoading.vue
@@ -33,10 +33,17 @@
 -->
 <script setup>
     import LoadingSpinner from '../LoadingSpinner.vue';
+
+    defineProps({
+        label: {
+            type: String,
+            default: 'Loading...',
+        },
+    });
 </script>
 
 <template>
     <div class="h-screen flex items-center justify-center">
-        <LoadingSpinner label="Loading Resource Hub..." />
+        <LoadingSpinner :label="label" />
     </div>
 </template>
diff --git a/resources/js/components/portal/category/SearchResults.vue b/resources/js/components/portal/category/SearchResults.vue
deleted file mode 100644
index cf8d0d1..0000000
--- a/resources/js/components/portal/category/SearchResults.vue
+++ /dev/null
@@ -1,130 +0,0 @@
-<!--
-<COPYRIGHT>
-
-    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
-
-    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
-    see https://github.com/canyongbs/common/blob/main/LICENSE.
-
-    Notice:
-
-    - You may not provide the software to third parties as a hosted or managed
-      service, where the service provides users with access to any substantial set of
-      the features or functionality of the software.
-    - You may not move, change, disable, or circumvent the license key functionality
-      in the software, and you may not remove or obscure any functionality in the
-      software that is protected by the license key.
-    - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor’s trademarks is subject
-      to applicable law.
-    - Canyon GBS LLC respects the intellectual property rights of others and expects the
-      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
-      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
-      vigorously.
-    - The software solution, including services, infrastructure, and code, is offered as a
-      Software as a Service (SaaS) by Canyon GBS LLC.
-    - Use of this software implies agreement to the license terms and conditions as stated
-      in the Elastic License 2.0.
-
-    For more information or inquiries please visit our website at
-    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
-
-</COPYRIGHT>
--->
-<script setup>
-    import { DocumentTextIcon, FolderIcon } from '@heroicons/vue/24/outline';
-    import SearchLoading from '../home/SearchLoading.vue';
-    import Subheading from '../Subheading.vue';
-    import Article from './Article.vue';
-    import ResourceList from '../ResourceList.vue';
-    import ResourceListItem from '../ResourceListItem.vue';
-
-    defineProps({
-        searchQuery: {
-            type: String,
-            required: true,
-        },
-        articles: {
-            type: Array,
-            default: () => [],
-        },
-        categories: {
-            type: Array,
-            default: () => [],
-        },
-        loadingResults: {
-            type: Boolean,
-            required: true,
-        },
-        hasResults: {
-            type: Boolean,
-            default: false,
-        },
-        label: {
-            type: String,
-            default: null,
-        },
-    });
-</script>
-
-<template>
-    <div v-if="loadingResults">
-        <SearchLoading />
-    </div>
-
-    <div v-if="!loadingResults && hasResults" class="flex flex-col gap-6">
-        <Subheading>
-            <template v-if="label">{{ label }}</template>
-            <template v-else>
-                Search results<template v-if="searchQuery">
-                    for <span class="text-gray-500">&ldquo;{{ searchQuery }}&rdquo;</span></template
-                >
-            </template>
-        </Subheading>
-
-        <div class="flex flex-col overflow-hidden rounded-xl bg-white shadow-sm ring-1 ring-gray-950/5">
-            <div v-if="articles.length > 0">
-                <ul role="list" class="divide-y">
-                    <li v-for="article in articles" :key="article.key">
-                        <Article
-                            :to="article.to"
-                            :name="article.name"
-                            :tags="article.tags"
-                            :featured="article.featured"
-                        />
-                    </li>
-                </ul>
-            </div>
-
-            <section v-else class="px-6 py-4 flex items-start gap-x-4">
-                <div class="flex size-12 items-center justify-center rounded-full bg-gray-100">
-                    <DocumentTextIcon class="size-6 text-gray-400" />
-                </div>
-
-                <div class="flex-1">
-                    <h4 class="text-base font-semibold leading-6 text-gray-950">No articles found</h4>
-
-                    <p class="mt-1 text-sm text-gray-500">No articles match your current search criteria.</p>
-                </div>
-            </section>
-        </div>
-
-        <ResourceList v-if="categories.length > 0" heading="Categories">
-            <ResourceListItem v-for="category in categories" :key="category.key" :to="category.to">
-                <template #primary>{{ category.name }}</template>
-            </ResourceListItem>
-        </ResourceList>
-
-        <section v-else class="rounded-xl bg-white shadow-sm ring-1 ring-gray-950/5 px-6 py-4 flex items-start gap-x-4">
-            <div class="flex size-12 items-center justify-center rounded-full bg-gray-100">
-                <FolderIcon class="size-6 text-gray-400" />
-            </div>
-
-            <div class="flex-1">
-                <h4 class="text-base font-semibold leading-6 text-gray-950">No categories found</h4>
-
-                <p class="mt-1 text-sm text-gray-500">No categories match your current search criteria.</p>
-            </div>
-        </section>
-    </div>
-</template>
diff --git a/resources/js/components/portal/home/CategoryCard.vue b/resources/js/components/portal/home/CategoryCard.vue
deleted file mode 100644
index 3b9f0eb..0000000
--- a/resources/js/components/portal/home/CategoryCard.vue
+++ /dev/null
@@ -1,80 +0,0 @@
-<!--
-<COPYRIGHT>
-
-    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
-
-    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
-    see https://github.com/canyongbs/common/blob/main/LICENSE.
-
-    Notice:
-
-    - You may not provide the software to third parties as a hosted or managed
-      service, where the service provides users with access to any substantial set of
-      the features or functionality of the software.
-    - You may not move, change, disable, or circumvent the license key functionality
-      in the software, and you may not remove or obscure any functionality in the
-      software that is protected by the license key.
-    - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor’s trademarks is subject
-      to applicable law.
-    - Canyon GBS LLC respects the intellectual property rights of others and expects the
-      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
-      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
-      vigorously.
-    - The software solution, including services, infrastructure, and code, is offered as a
-      Software as a Service (SaaS) by Canyon GBS LLC.
-    - Use of this software implies agreement to the license terms and conditions as stated
-      in the Elastic License 2.0.
-
-    For more information or inquiries please visit our website at
-    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
-
-</COPYRIGHT>
--->
-<script setup>
-    import { ChevronRightIcon } from '@heroicons/vue/20/solid';
-
-    defineProps({
-        to: {
-            type: [Object, String],
-            required: true,
-        },
-        icon: {
-            type: String,
-            default: null,
-        },
-        name: {
-            type: String,
-            required: true,
-        },
-        description: {
-            type: String,
-            default: null,
-        },
-    });
-</script>
-
-<template>
-    <router-link
-        :to="to"
-        class="group flex items-start w-full gap-3 rounded-xl bg-white px-6 py-4 ring-1 ring-gray-950/5 transition duration-75 hover:bg-gray-50"
-    >
-        <div
-            v-if="icon"
-            v-html="icon"
-            class="shrink-0 text-gray-400 [&>svg]:size-6 transition duration-75 group-hover:text-brand-500"
-            aria-hidden="true"
-        ></div>
-
-        <div class="mt-0.5 grid flex-1 gap-1 min-w-0">
-            <span class="text-sm font-medium text-gray-950">{{ name }}</span>
-            <p class="overflow-hidden text-sm text-pretty break-words text-gray-500">
-                {{ description }}
-            </p>
-        </div>
-
-        <ChevronRightIcon
-            class="shrink-0 size-5 self-center text-gray-400 opacity-0 transition-all group-hover:translate-x-1 group-hover:opacity-100"
-        />
-    </router-link>
-</template>
diff --git a/resources/js/components/portal/home/SearchLoading.vue b/resources/js/components/portal/home/SearchLoading.vue
deleted file mode 100644
index f7a9486..0000000
--- a/resources/js/components/portal/home/SearchLoading.vue
+++ /dev/null
@@ -1,40 +0,0 @@
-<!--
-<COPYRIGHT>
-
-    Copyright © 2016-2026, Canyon GBS LLC. All rights reserved.
-
-    Canyon GBS Common is licensed under the Elastic License 2.0. For more details,
-    see https://github.com/canyongbs/common/blob/main/LICENSE.
-
-    Notice:
-
-    - You may not provide the software to third parties as a hosted or managed
-      service, where the service provides users with access to any substantial set of
-      the features or functionality of the software.
-    - You may not move, change, disable, or circumvent the license key functionality
-      in the software, and you may not remove or obscure any functionality in the
-      software that is protected by the license key.
-    - You may not alter, remove, or obscure any licensing, copyright, or other notices
-      of the licensor in the software. Any use of the licensor’s trademarks is subject
-      to applicable law.
-    - Canyon GBS LLC respects the intellectual property rights of others and expects the
-      same in return. Canyon GBS™ and Canyon GBS Common are registered trademarks of
-      Canyon GBS LLC, and we are committed to enforcing and protecting our trademarks
-      vigorously.
-    - The software solution, including services, infrastructure, and code, is offered as a
-      Software as a Service (SaaS) by Canyon GBS LLC.
-    - Use of this software implies agreement to the license terms and conditions as stated
-      in the Elastic License 2.0.
-
-    For more information or inquiries please visit our website at
-    https://www.canyongbs.com or contact us via email at legal@canyongbs.com.
-
-</COPYRIGHT>
--->
-<script setup>
-    import LoadingSpinner from '../../LoadingSpinner.vue';
-</script>
-
-<template>
-    <LoadingSpinner label="Searching Resource Hub..." />
-</template>