From 0e8b3136080065decad11a6cd50ac65efb4000a4 Mon Sep 17 00:00:00 2001
From: Pascal Martineau <pascal@lewebsimple.ca>
Date: Tue, 16 Sep 2025 14:04:19 -0400
Subject: [PATCH] wip: espace-membre page

---
 .../auth/{LoginLogoutButton.vue => AuthButton.vue} |  2 +-
 .../components/member-area/MemberAreaButton.vue    | 14 ++++++++++++++
 .../ccat/app/components/site/SiteHeaderTop.vue     |  5 ++---
 wp-content/themes/ccat/app/pages/espace-membre.vue | 11 +++++++++++
 4 files changed, 28 insertions(+), 4 deletions(-)
 rename wp-content/themes/ccat/app/components/auth/{LoginLogoutButton.vue => AuthButton.vue} (100%)
 create mode 100644 wp-content/themes/ccat/app/components/member-area/MemberAreaButton.vue
 create mode 100644 wp-content/themes/ccat/app/pages/espace-membre.vue

diff --git a/wp-content/themes/ccat/app/components/auth/LoginLogoutButton.vue b/wp-content/themes/ccat/app/components/auth/AuthButton.vue
similarity index 100%
rename from wp-content/themes/ccat/app/components/auth/LoginLogoutButton.vue
rename to wp-content/themes/ccat/app/components/auth/AuthButton.vue
index 17476ce..d9ef44e 100644
--- a/wp-content/themes/ccat/app/components/auth/LoginLogoutButton.vue
+++ b/wp-content/themes/ccat/app/components/auth/AuthButton.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
-const { loggedIn } = useUserSession();
 defineProps<{ showLabels: boolean }>();
+const { loggedIn } = useUserSession();
 </script>
 
 <template>
diff --git a/wp-content/themes/ccat/app/components/member-area/MemberAreaButton.vue b/wp-content/themes/ccat/app/components/member-area/MemberAreaButton.vue
new file mode 100644
index 0000000..ea52532
--- /dev/null
+++ b/wp-content/themes/ccat/app/components/member-area/MemberAreaButton.vue
@@ -0,0 +1,14 @@
+<script setup lang="ts">
+defineProps<{ showLabels: boolean }>();
+const { loggedIn } = useUserSession();
+const label = computed(() => (loggedIn ? "Espace membre" : "Devenir membre"));
+</script>
+
+<template>
+  <UButton
+    icon="i-lucide-user"
+    color="primary"
+    to="/espace-membre"
+    :label="showLabels ? label : undefined"
+  />
+</template>
diff --git a/wp-content/themes/ccat/app/components/site/SiteHeaderTop.vue b/wp-content/themes/ccat/app/components/site/SiteHeaderTop.vue
index c9f0020..ca58ead 100644
--- a/wp-content/themes/ccat/app/components/site/SiteHeaderTop.vue
+++ b/wp-content/themes/ccat/app/components/site/SiteHeaderTop.vue
@@ -9,8 +9,7 @@ const showLabels = breakpoints.greaterOrEqual("sm");
   <UContainer class="flex items-center gap-1.5">
     <UiSocialProfiles :profiles="profiles" class="mr-auto" />
     <UNavigationMenu :items="menuItems" variant="link" content-orientation="vertical" />
-    <LoginLogoutButton :show-labels="showLabels" />
-    <SignUpButton :show-labels="showLabels" />
-    <UserSwitchButton :user-id="2" />
+    <AuthButton :show-labels="showLabels" />
+    <MemberAreaButton :show-labels="showLabels" />
   </UContainer>
 </template>
diff --git a/wp-content/themes/ccat/app/pages/espace-membre.vue b/wp-content/themes/ccat/app/pages/espace-membre.vue
new file mode 100644
index 0000000..29cf0c6
--- /dev/null
+++ b/wp-content/themes/ccat/app/pages/espace-membre.vue
@@ -0,0 +1,11 @@
+<script setup lang="ts">
+useSeoMeta({ title: "Espace membre" });
+</script>
+
+<template>
+  <div>
+    <UContainer>
+      <h1>Espace membre</h1>
+    </UContainer>
+  </div>
+</template>