# All files / js/components NavFooter.vue

0% Statements 0/9
0% Branches 0/6
0% Functions 0/8
0% Lines 0/8

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58

     <script setup lang="ts">
    import {
        SidebarGroup,
        SidebarGroupContent,
        SidebarMenu,
        SidebarMenuButton,
        SidebarMenuItem,
    } from '@/components/ui/sidebar';
    import { toUrl } from '@/lib/utils';
    import { type NavItem } from '@/types';
    import { Link } from '@inertiajs/vue3';

    interface Props {
        items: NavItem[];
        class?: string;
    }

    defineProps<Props>();

    function isExternalUrl(href: string): boolean {
        return href.startsWith('http://') || href.startsWith('https://');
    }
    </script>

    <template>
        <SidebarGroup
            :class="`group-data-[collapsible=icon]:p-0 ${$props.class || ''}`"
        >
            <SidebarGroupContent>
                <SidebarMenu>
                    <SidebarMenuItem v-for="item in items" :key="item.title">
                        <SidebarMenuButton
                            class="rounded-xl border border-transparent px-2.5 text-sidebar-foreground/75 transition-all duration-200 hover:border-sidebar-border/70 hover:bg-sidebar-accent/80 hover:text-sidebar-foreground data-[active=true]:border-primary/25 data-[active=true]:bg-primary/10 data-[active=true]:text-primary data-[active=true]:shadow-sm dark:data-[active=true]:border-primary/35 dark:data-[active=true]:bg-primary/20"
                            as-child
                        >
                            <Link
                                v-if="!isExternalUrl(toUrl(item.href))"
                                :href="toUrl(item.href)"
                            >
                                <component :is="item.icon" />
                                <span>{{ item.title }}</span>
                            </Link>
                            <a
                                v-else
                                :href="toUrl(item.href)"
                                target="_blank"
                                rel="noopener noreferrer"
                            >
                                <component :is="item.icon" />
                                <span>{{ item.title }}</span>
                            </a>
                        </SidebarMenuButton>
                    </SidebarMenuItem>
                </SidebarMenu>
            </SidebarGroupContent>
        </SidebarGroup>
    </template>