ui: polish navbar visibility and home page greetings

Hide My Schedule link from admin users (they have dashboard instead).
Add 60+ randomized greeting strings split between returning and new users.
Update dev script admin seed name.

Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent)

Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
This commit is contained in:
2026-04-29 22:56:35 +01:00
co-authored by Sisyphus
parent ce1a25f054
commit 60ec5a0a8c
3 changed files with 87 additions and 5 deletions
@@ -8,7 +8,7 @@
const links = [
{ href: '/', label: 'Home', showWhen: 'always', width: 'w-12' },
{ href: '/prices', label: 'Price List', showWhen: 'guest', width: 'w-20' },
{ href: '/schedule', label: 'My Schedule', showWhen: 'auth', width: 'w-24' },
{ href: '/schedule', label: 'My Schedule', showWhen: 'auth-not-admin', width: 'w-24' },
{ href: '/book', label: 'Book an appointment', showWhen: 'auth', width: 'w-36' },
{ href: '/portfolio', label: 'Portfolio', showWhen: 'always', width: 'w-20' },
{ href: '/admin', label: 'Admin Dashboard', showWhen: 'admin', width: 'w-28' },
@@ -40,13 +40,18 @@
if (link.showWhen === 'always') return true;
if (link.showWhen === 'guest' && !authStore.isAuthenticated) return true;
if (link.showWhen === 'auth' && authStore.isAuthenticated) return true;
if (
link.showWhen === 'auth-not-admin' &&
authStore.isAuthenticated &&
authStore.currentUser?.role !== 'admin'
)
return true;
if (link.showWhen === 'admin' && authStore.currentUser?.role === 'admin') return true;
return false;
};
// Derived values for auth state - ensures reactivity
let isAuthenticated = $derived(authStore.isAuthenticated);
let currentUserRole = $derived(authStore.currentUser?.role);
let isLoading = $derived(authStore.isLoading);
</script>
+79 -2
View File
@@ -3,6 +3,83 @@
import PortfolioCarousel from '$lib/components/layout/PortfolioCarousel.svelte';
import { authStore } from '$lib/stores/auth.svelte';
import { Skeleton } from '$lib/components/ui/skeleton';
const returningGreetings = [
(name: string) => `Welcome back, ${name}!`,
(name: string) => `Great to see you again, ${name}!`,
(name: string) => `Good to have you back, ${name}!`,
(name: string) => `Hey, you're back, ${name}!`,
(name: string) => `Lovely to see you again, ${name}!`,
(name: string) => `We missed you, ${name}!`,
(name: string) => `${name}, it's so good to see you!`,
(name: string) => `${name}, welcome back to Crussell Nails!`,
(name: string) => `Always a pleasure, ${name}!`,
(name: string) => `${name}, you're a sight for sore eyes!`,
(name: string) => `So happy you're back, ${name}!`,
(name: string) => `You're back! Great to see you, ${name}!`,
(name: string) => `${name}, you've been missed!`,
(name: string) => `Ready for some pampering, ${name}?`,
(name: string) => `${name}, lovely to have you back with us!`,
(name: string) => `Great to have you back, ${name}!`,
(name: string) => `Back for more, ${name}?`,
(name: string) => `Ah, ${name}! Right on time!`,
(name: string) => `Welcome home, ${name}!`,
(name: string) => `${name}, we've been looking forward to seeing you!`,
(name: string) => `It's always a good day when ${name} walks in!`,
(name: string) => `${name}, your favourite nail artist is waiting!`,
(name: string) => `How wonderful to see you, ${name}!`,
(name: string) => `${name}, you're as welcome as ever!`,
(name: string) => `Another visit, ${name}? You spoil us!`,
(name: string) => `${name}, you always brighten up our day!`,
(name: string) => `Great timing, ${name} — let's get started!`,
(name: string) => `${name}, you deserve every bit of this!`,
(name: string) => `So glad you're here again, ${name}!`,
(name: string) => `Look who it is — the wonderful ${name}!`
];
const unverifiedGreetings = [
(name: string) => `Welcome, ${name}!`,
(name: string) => `Hi, ${name}! Great to meet you!`,
(name: string) => `Hey ${name}, welcome aboard!`,
(name: string) => `Hello, ${name}! Lovely to have you here!`,
(name: string) => `Good to meet you, ${name}!`,
(name: string) => `${name}, welcome to Crussell Nails!`,
(name: string) => `Hi ${name}, we're so glad you're here!`,
(name: string) => `Welcome in, ${name}!`,
(name: string) => `${name}, it's great to have you with us!`,
(name: string) => `Hello ${name}, glad you found us!`,
(name: string) => `${name}, welcome — you're going to love it here!`,
(name: string) => `Nice to meet you, ${name}!`,
(name: string) => `${name}, welcome to the family!`,
(name: string) => `Hey ${name}, so happy to have you here!`,
(name: string) => `${name}, you've come to the right place!`,
(name: string) => `Welcome, ${name} — we're thrilled to have you!`,
(name: string) => `${name}, let's get you pampered!`,
(name: string) => `Great to have you here, ${name}!`,
(name: string) => `${name}, welcome — something beautiful awaits!`,
(name: string) => `${name}, your journey to great nails starts here!`,
(name: string) => `So excited to have you here, ${name}!`,
(name: string) => `${name}, we can't wait to show you what we do!`,
(name: string) => `A big welcome to you, ${name}!`,
(name: string) => `${name}, we're so glad you chose Crussell Nails!`,
(name: string) => `Hi ${name}, you're in great hands here!`,
(name: string) => `${name}, this is the beginning of something beautiful!`,
(name: string) => `Welcome ${name} — you picked the perfect place!`,
(name: string) => `${name}, we love meeting new faces!`,
(name: string) => `${name}, we're delighted to have you with us!`,
(name: string) => `Hello ${name}, great things are ahead!`,
(name: string) => `${name}, we're already excited to look after you!`,
(name: string) => `Welcome ${name} — you're going to fit right in!`,
(name: string) => `So glad you're here, ${name}!`,
(name: string) => `${name}, you've made an excellent choice today!`,
(name: string) => `Welcome to the club, ${name}!`
];
function getRandomGreeting(name: string, isReturning: boolean): string {
const greetings = isReturning ? returningGreetings : unverifiedGreetings;
const randomIndex = Math.floor(Math.random() * greetings.length);
return greetings[randomIndex](name);
}
</script>
<svelte:head>
@@ -29,9 +106,9 @@
{#if !authStore.isAuthenticated}
Welcome to Crussell Nails
{:else if authStore.currentUser?.role === 'unverified_email'}
Welcome {authStore.currentUser?.firstName}
{getRandomGreeting(authStore.currentUser?.firstName || '', false)}
{:else}
Welcome back {authStore.currentUser?.firstName}
{getRandomGreeting(authStore.currentUser?.firstName || '', true)}
{/if}
</h1>
<p class="mb-8 text-lg text-gray-600">
+1 -1
View File
@@ -257,7 +257,7 @@ success=0
total=20
# Admin
if api_post "$BASE_URL/register" '{"firstName":"Admin","lastName":"User","email":"admin@example.com","password":"password","phone":"+447000000000","dateOfBirth":"1985-01-01","agreedToPolicy":true}' "Register Admin" "" > /dev/null; then success=$((success+1)); fi
if api_post "$BASE_URL/register" '{"firstName":"Chelsea","lastName":"Russell","email":"admin@example.com","password":"password","phone":"+447000000000","dateOfBirth":"1985-01-01","agreedToPolicy":true}' "Register Admin" "" > /dev/null; then success=$((success+1)); fi
# Primary test user (no-deposit, easy to book with)
if api_post "$BASE_URL/register" '{"firstName":"Regular","lastName":"User","email":"user@example.com","password":"password","phone":"+447000000001","dateOfBirth":"1990-05-15","agreedToPolicy":true}' "Register User" "" > /dev/null; then success=$((success+1)); fi