Skip to content

Rename url to href in navigation items for consistency #17

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Feb 24, 2025
Merged

Rename url to href in navigation items for consistency #17

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
782ce8b
fix: correct className to class in AppHeader.vue
oketafred Feb 24, 2025
8be76cf
Merge branch 'laravel:main' into main
oketafred Feb 24, 2025
ab08117
refactor: Rename `url` to `href` in navigation items for consistency
oketafred Feb 24, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 10 additions & 10 deletions resources/js/components/AppHeader.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import {
NavigationMenuList,
navigationMenuTriggerStyle,
} from '@/components/ui/navigation-menu';
import { Sheet, SheetContent, SheetHeader, SheetTrigger } from '@/components/ui/sheet';
import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetTrigger } from '@/components/ui/sheet';
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
import UserMenuContent from '@/components/UserMenuContent.vue';
import { getInitials } from '@/composables/useInitials';
Expand Down Expand Up @@ -40,20 +40,20 @@ const activeItemStyles = computed(() => (url: string) => (isCurrentRoute(url) ?
const mainNavItems: NavItem[] = [
{
title: 'Dashboard',
url: '/dashboard',
href: '/dashboard',
icon: LayoutGrid,
},
];

const rightNavItems: NavItem[] = [
{
title: 'Repository',
url: 'https://github.com/laravel/vue-starter-kit',
href: 'https://github.com/laravel/vue-starter-kit',
icon: Folder,
},
{
title: 'Documentation',
url: 'https://laravel.com/docs/starter-kits',
href: 'https://laravel.com/docs/starter-kits',
icon: BookOpen,
},
];
Expand Down Expand Up @@ -81,9 +81,9 @@ const rightNavItems: NavItem[] = [
<Link
v-for="item in mainNavItems"
:key="item.title"
:href="item.url"
:href="item.href"
class="flex items-center gap-x-3 rounded-lg px-3 py-2 text-sm font-medium hover:bg-accent"
:class="activeItemStyles(item.url)"
:class="activeItemStyles(item.href)"
>
<component v-if="item.icon" :is="item.icon" class="h-5 w-5" />
{{ item.title }}
Expand All @@ -93,7 +93,7 @@ const rightNavItems: NavItem[] = [
<a
v-for="item in rightNavItems"
:key="item.title"
:href="item.url"
:href="item.href"
target="_blank"
rel="noopener noreferrer"
class="flex items-center space-x-2 text-sm font-medium"
Expand All @@ -116,9 +116,9 @@ const rightNavItems: NavItem[] = [
<NavigationMenu class="ml-10 flex h-full items-stretch">
<NavigationMenuList class="flex h-full items-stretch space-x-2">
<NavigationMenuItem v-for="(item, index) in mainNavItems" :key="index" class="relative flex h-full items-center">
<Link :href="item.url">
<Link :href="item.href">
<NavigationMenuLink
:class="[navigationMenuTriggerStyle(), activeItemStyles(item.url), 'h-9 cursor-pointer px-3']"
:class="[navigationMenuTriggerStyle(), activeItemStyles(item.href), 'h-9 cursor-pointer px-3']"
>
<component v-if="item.icon" :is="item.icon" class="mr-2 h-4 w-4" />
{{ item.title }}
Expand All @@ -142,7 +142,7 @@ const rightNavItems: NavItem[] = [
<Tooltip>
<TooltipTrigger>
<Button variant="ghost" size="icon" as-child class="group h-9 w-9 cursor-pointer">
<a :href="item.url" target="_blank" rel="noopener noreferrer">
<a :href="item.href" target="_blank" rel="noopener noreferrer">
<span class="sr-only">{{ item.title }}</span>
<component :is="item.icon" class="size-5 opacity-80 group-hover:opacity-100" />
</a>
Expand Down
6 changes: 3 additions & 3 deletions resources/js/components/AppSidebar.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,20 +11,20 @@ import AppLogo from './AppLogo.vue';
const mainNavItems: NavItem[] = [
{
title: 'Dashboard',
url: '/dashboard',
href: '/dashboard',
icon: LayoutGrid,
},
];

const footerNavItems: NavItem[] = [
{
title: 'Github Repo',
url: 'https://github.com/laravel/vue-starter-kit',
href: 'https://github.com/laravel/vue-starter-kit',
icon: Folder,
},
{
title: 'Documentation',
url: 'https://laravel.com/docs/starter-kits',
href: 'https://laravel.com/docs/starter-kits',
icon: BookOpen,
},
];
Expand Down
2 changes: 1 addition & 1 deletion resources/js/components/NavFooter.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ defineProps<Props>();
<SidebarMenu>
<SidebarMenuItem v-for="item in items" :key="item.title">
<SidebarMenuButton class="text-neutral-600 hover:text-neutral-800 dark:text-neutral-300 dark:hover:text-neutral-100" as-child>
<a :href="item.url" target="_blank" rel="noopener noreferrer">
<a :href="item.href" target="_blank" rel="noopener noreferrer">
<component :is="item.icon" />
<span>{{ item.title }}</span>
</a>
Expand Down