make register and login to layout

front/src/components/ui/Button.astro

@@ -6,6 +6,7 @@ import type { CallToAction as Props } from '~/types';
 const {
   variant = 'secondary',
   target,
+  link,
   text = Astro.slots.render('default'),
   icon = '',
   class: className = '',
@@ -31,6 +32,7 @@ const variants = {
     <a
       class={twMerge(variants[variant] || '', className)}
       {...(target ? { target: target, rel: 'noopener noreferrer' } : {})}
+      {...(link ? { href: link} : {})}
       {...rest}
     >
       <Fragment set:html={text} />

front/src/components/widgets/Header.astro

@@ -1,37 +1,40 @@
 ---
-import { Icon } from 'astro-icon/components';
+import { Icon } from 'astro-icon/components'
-import Logo from '~/components/Logo.astro';
+import Logo from 'components/Logo.astro'
-import ToggleTheme from '~/components/common/ToggleTheme.astro';
+import ToggleTheme from 'components/common/ToggleTheme.astro'
-import ToggleMenu from '~/components/common/ToggleMenu.astro';
+import ToggleMenu from 'components/common/ToggleMenu.astro'
-import Button from '~/components/ui/Button.astro';
+import Button from 'components/ui/Button.astro'
 
-import { getHomePermalink } from '~/utils/permalinks';
+import { getHomePermalink } from 'utils/permalinks'
-import { trimSlash, getAsset } from '~/utils/permalinks';
+import { trimSlash, getAsset } from 'utils/permalinks'
-import type { CallToAction } from '~/types';
+import type { CallToAction } from 'types'
 
+const pb = Astro.locals.pb
+
+const connected = pb.authStore.isValid
 interface Link {
-  text?: string;
+	text?: string
-  href?: string;
+	href?: string
-  ariaLabel?: string;
+	ariaLabel?: string
-  icon?: string;
+	icon?: string
 }
 
 interface ActionLink extends CallToAction {}
 
 interface MenuLink extends Link {
-  links?: Array<MenuLink>;
+	links?: Array<MenuLink>
 }
 
 export interface Props {
-  id?: string;
+	id?: string
-  links?: Array<MenuLink>;
+	links?: Array<MenuLink>
-  actions?: Array<ActionLink>;
+	actions?: Array<ActionLink>
-  isSticky?: boolean;
+	isSticky?: boolean
-  isDark?: boolean;
+	isDark?: boolean
-  isFullWidth?: boolean;
+	isFullWidth?: boolean
-  showToggleTheme?: boolean;
+	showToggleTheme?: boolean
-  showRssFeed?: boolean;
+	showRssFeed?: boolean
-  position?: string;
+	position?: string
 }
 
 const {
@@ -44,9 +47,9 @@ const {
 	showToggleTheme = false,
 	showRssFeed = false,
 	position = 'center',
-} = Astro.props;
+} = Astro.props
 
-const currentPath = `/${trimSlash(new URL(Astro.url).pathname)}`;
+const currentPath = `/${trimSlash(new URL(Astro.url).pathname)}`
 ---
 
 <header
@@ -149,17 +152,21 @@ const currentPath = `/${trimSlash(new URL(Astro.url).pathname)}`;
 						)
 					}
 				</div>
-        {
+				{ !connected && (
-          actions?.length ? (
           <span class="ml-4 rtl:ml-0 rtl:mr-4">
-              {actions.map((btnProps) => (
+            <Button link='/account/login' variant='primary' class="ml-2 py-2.5 px-5.5 md:px-6 font-semibold shadow-none text-sm w-auto">
-                <Button {...btnProps} class="ml-2 py-2.5 px-5.5 md:px-6 font-semibold shadow-none text-sm w-auto" />
+              Connexion
-              ))}
+            </Button>
+            <Button link='/account/register' variant='secondary' class="ml-2 py-2.5 px-5.5 md:px-6 font-semibold shadow-none text-sm w-auto">
+              Inscription
+            </Button>
           </span>
-          ) : (
+        )}
-            ''
+        { connected && (
-          )
+          <Button link='/account/logout' variant='primary' class="ml-2 py-2.5 px-5.5 md:px-6 font-semibold shadow-none text-sm w-auto">
-        }
+            Déconnexion
+          </Button>
+        )}
 			</div>
 		</div>
 	</div>

front/src/layouts/PageLayout.astro

@@ -21,7 +21,7 @@ const { metadata } = Astro.props;
       <Announcement />
     </slot> -->
     <slot name="header">
-      <Header {...headerData} isSticky showRssFeed showToggleTheme />
+      <Header {...headerData} isSticky showToggleTheme />
     </slot>
     <main>
       <slot />

front/src/navigation.js

@@ -1,4 +1,4 @@
-import { getPermalink, getBlogPermalink, getAsset } from './utils/permalinks';
+import { getPermalink, getBlogPermalink } from './utils/permalinks'
 
 export const headerData = {
 	links: [
@@ -94,7 +94,10 @@ export const headerData = {
 				},
 				{
 					text: 'Article',
-          href: getPermalink('get-started-website-with-astro-tailwind-css', 'post'),
+					href: getPermalink(
+						'get-started-website-with-astro-tailwind-css',
+						'post'
+					),
 				},
 				{
 					text: 'Article (with MDX)',
@@ -115,8 +118,14 @@ export const headerData = {
 			href: '#',
 		},
 	],
-  actions: [{ text: 'Download', href: 'https://github.com/onwidget/astrowind', target: '_blank' }],
+	// actions: [
-};
+	// 	{
+	// 		text: 'Connexion',
+	// 		href: '',
+	// 		target: '_blank',
+	// 	},
+	// ],
+}
 
 export const footerData = {
 	links: [
@@ -125,11 +134,6 @@ export const footerData = {
 			links: [
 				{ text: 'Features', href: '#' },
 				{ text: 'Security', href: '#' },
-        { text: 'Team', href: '#' },
-        { text: 'Enterprise', href: '#' },
-        { text: 'Customer stories', href: '#' },
-        { text: 'Pricing', href: '#' },
-        { text: 'Resources', href: '#' },
 			],
 		},
 		{
@@ -137,9 +141,6 @@ export const footerData = {
 			links: [
 				{ text: 'Developer API', href: '#' },
 				{ text: 'Partners', href: '#' },
-        { text: 'Atom', href: '#' },
-        { text: 'Electron', href: '#' },
-        { text: 'AstroWind Desktop', href: '#' },
 			],
 		},
 		{
@@ -147,9 +148,6 @@ export const footerData = {
 			links: [
 				{ text: 'Docs', href: '#' },
 				{ text: 'Community Forum', href: '#' },
-        { text: 'Professional Services', href: '#' },
-        { text: 'Skills', href: '#' },
-        { text: 'Status', href: '#' },
 			],
 		},
 		{
@@ -157,11 +155,6 @@ export const footerData = {
 			links: [
 				{ text: 'About', href: '#' },
 				{ text: 'Blog', href: '#' },
-        { text: 'Careers', href: '#' },
-        { text: 'Press', href: '#' },
-        { text: 'Inclusion', href: '#' },
-        { text: 'Social Impact', href: '#' },
-        { text: 'Shop', href: '#' },
 			],
 		},
 	],
@@ -169,15 +162,5 @@ export const footerData = {
 		{ text: 'Terms', href: getPermalink('/terms') },
 		{ text: 'Privacy Policy', href: getPermalink('/privacy') },
 	],
-  socialLinks: [
+	socialLinks:[]
-    { ariaLabel: 'X', icon: 'tabler:brand-x', href: '#' },
+}
-    { ariaLabel: 'Instagram', icon: 'tabler:brand-instagram', href: '#' },
-    { ariaLabel: 'Facebook', icon: 'tabler:brand-facebook', href: '#' },
-    { ariaLabel: 'RSS', icon: 'tabler:rss', href: getAsset('/rss.xml') },
-    { ariaLabel: 'Github', icon: 'tabler:brand-github', href: 'https://github.com/onwidget/astrowind' },
-  ],
-  footNote: `
-    <img class="w-5 h-5 md:w-6 md:h-6 md:-mt-0.5 bg-cover mr-1.5 rtl:mr-0 rtl:ml-1.5 float-left rtl:float-right rounded-sm" src="https://onwidget.com/favicon/favicon-32x32.png" alt="onWidget logo" loading="lazy"></img>
-    Made by <a class="text-blue-600 underline dark:text-muted" href="https://onwidget.com/"> onWidget</a> · All rights reserved.
-  `,
-};

front/src/pages/account/index.astro

@@ -1,5 +1,6 @@
 ---
-import Layout from 'layouts/Layout.astro'
+import Layout from 'layouts/PageLayout.astro';
+//import Layout from 'layouts/Layout.astro';
 import PocketBase from 'pocketbase'
 
 
@@ -11,11 +12,12 @@ if(!auth.isValid){
     return Astro.redirect("/account/login");
 }
 
+const metadata = {
+  title: 'Account',
+  ignoreTitleTemplate: true,
+};
 ---
 
-<Layout title="Account setting">
+<Layout metadata={metadata}>
     <h1>Bonjour {user!.username}</h1>
-    <div>
-        <a href="/account/logout">deconnexion</a>
-    </div>
 </Layout>

front/src/pages/account/login.astro

@@ -1,5 +1,6 @@
 ---
-import Layout from "layouts/Layout.astro";
+import Layout from 'layouts/PageLayout.astro';
+//import Layout from 'layouts/Layout.astro';
 import AstroUtils from "libs/AstroUtils";
 import PocketBase from 'pocketbase'
 
@@ -29,9 +30,14 @@ const res = await AstroUtils.wrap(async () => {
         return Astro.redirect("/account/login");// route('/account/login', {message: 'Compte invalide, valider les identifiants'})) //XXX: comprendre comment le system de route fonctionne
     }
 })
+
+const metadata = {
+  title: 'Login',
+  ignoreTitleTemplate: true,
+};
 ---
 
-<Layout title="login">
+<Layout metadata={metadata}>
     <form id="account-creation" method="post" enctype="multipart/form-data">
         <input required name="username" placeholder="Pseudo ou email"/>
         <input required name="password" type="password" placeholder="Mot de passe" />

front/src/pages/account/logout.astro

@@ -8,6 +8,6 @@ if(pb.authStore.isValid){
     pb.authStore.clear()
 }
 
-return Astro.redirect('/account/login')
+return Astro.redirect('/')
 
 ---

front/src/pages/account/register.astro

@@ -58,7 +58,7 @@ await AstroUtils.wrap(async () => {
 })
 
 const metadata = {
-  title: 'register',
+  title: 'Register',
   ignoreTitleTemplate: true,
 };
 ---

front/src/types.d.ts

@@ -1,288 +1,288 @@
-import type { AstroComponentFactory } from 'astro/runtime/server/index.js';
+import type { AstroComponentFactory } from 'astro/runtime/server/index.js'
-import type { HTMLAttributes, ImageMetadata } from 'astro/types';
+import type { HTMLAttributes, ImageMetadata } from 'astro/types'
 
 export interface Post {
   /** A unique ID number that identifies a post. */
-  id: string;
+  id: string
 
   /** A post’s unique slug – part of the post’s URL based on its name, i.e. a post called “My Sample Page” has a slug “my-sample-page”. */
-  slug: string;
+  slug: string
 
   /**  */
-  permalink: string;
+  permalink: string
 
   /**  */
-  publishDate: Date;
+  publishDate: Date
   /**  */
-  updateDate?: Date;
+  updateDate?: Date
 
   /**  */
-  title: string;
+  title: string
   /** Optional summary of post content. */
-  excerpt?: string;
+  excerpt?: string
   /**  */
-  image?: ImageMetadata | string;
+  image?: ImageMetadata | string
 
   /**  */
-  category?: Taxonomy;
+  category?: Taxonomy
   /**  */
-  tags?: Taxonomy[];
+  tags?: Taxonomy[]
   /**  */
-  author?: string;
+  author?: string
 
   /**  */
-  metadata?: MetaData;
+  metadata?: MetaData
 
   /**  */
-  draft?: boolean;
+  draft?: boolean
 
   /**  */
-  Content?: AstroComponentFactory;
+  Content?: AstroComponentFactory
-  content?: string;
+  content?: string
 
   /**  */
-  readingTime?: number;
+  readingTime?: number
 }
 
 export interface Taxonomy {
-  slug: string;
+  slug: string
-  title: string;
+  title: string
 }
 
 export interface MetaData {
-  title?: string;
+  title?: string
-  ignoreTitleTemplate?: boolean;
+  ignoreTitleTemplate?: boolean
 
-  canonical?: string;
+  canonical?: string
 
-  robots?: MetaDataRobots;
+  robots?: MetaDataRobots
 
-  description?: string;
+  description?: string
 
-  openGraph?: MetaDataOpenGraph;
+  openGraph?: MetaDataOpenGraph
-  twitter?: MetaDataTwitter;
+  twitter?: MetaDataTwitter
 }
 
 export interface MetaDataRobots {
-  index?: boolean;
+  index?: boolean
-  follow?: boolean;
+  follow?: boolean
 }
 
 export interface MetaDataImage {
-  url: string;
+  url: string
-  width?: number;
+  width?: number
-  height?: number;
+  height?: number
 }
 
 export interface MetaDataOpenGraph {
-  url?: string;
+  url?: string
-  siteName?: string;
+  siteName?: string
-  images?: Array<MetaDataImage>;
+  images?: Array<MetaDataImage>
-  locale?: string;
+  locale?: string
-  type?: string;
+  type?: string
 }
 
 export interface MetaDataTwitter {
-  handle?: string;
+  handle?: string
-  site?: string;
+  site?: string
-  cardType?: string;
+  cardType?: string
 }
 
 export interface Image {
-  src: string;
+  src: string
-  alt?: string;
+  alt?: string
 }
 
 export interface Video {
-  src: string;
+  src: string
-  type?: string;
+  type?: string
 }
 
 export interface Widget {
-  id?: string;
+  id?: string
-  isDark?: boolean;
+  isDark?: boolean
-  bg?: string;
+  bg?: string
-  classes?: Record<string, string | Record<string, string>>;
+  classes?: Record<string, string | Record<string, string>>
 }
 
 export interface Headline {
-  title?: string;
+  title?: string
-  subtitle?: string;
+  subtitle?: string
-  tagline?: string;
+  tagline?: string
-  classes?: Record<string, string>;
+  classes?: Record<string, string>
 }
 
 interface TeamMember {
-  name?: string;
+  name?: string
-  job?: string;
+  job?: string
-  image?: Image;
+  image?: Image
-  socials?: Array<Social>;
+  socials?: Array<Social>
-  description?: string;
+  description?: string
-  classes?: Record<string, string>;
+  classes?: Record<string, string>
 }
 
 interface Social {
-  icon?: string;
+  icon?: string
-  href?: string;
+  href?: string
 }
 
 export interface Stat {
-  amount?: number | string;
+  amount?: number | string
-  title?: string;
+  title?: string
-  icon?: string;
+  icon?: string
 }
 
 export interface Item {
-  title?: string;
+  title?: string
-  description?: string;
+  description?: string
-  icon?: string;
+  icon?: string
-  classes?: Record<string, string>;
+  classes?: Record<string, string>
-  callToAction?: CallToAction;
+  callToAction?: CallToAction
-  image?: Image;
+  image?: Image
 }
 
 export interface Price {
-  title?: string;
+  title?: string
-  subtitle?: string;
+  subtitle?: string
-  description?: string;
+  description?: string
-  price?: number | string;
+  price?: number | string
-  period?: string;
+  period?: string
-  items?: Array<Item>;
+  items?: Array<Item>
-  callToAction?: CallToAction;
+  callToAction?: CallToAction
-  hasRibbon?: boolean;
+  hasRibbon?: boolean
-  ribbonTitle?: string;
+  ribbonTitle?: string
 }
 
 export interface Testimonial {
-  title?: string;
+  title?: string
-  testimonial?: string;
+  testimonial?: string
-  name?: string;
+  name?: string
-  job?: string;
+  job?: string
-  image?: string | unknown;
+  image?: string | unknown
 }
 
 export interface Input {
-  type: HTMLInputTypeAttribute;
+  type: HTMLInputTypeAttribute
-  name: string;
+  name: string
-  label?: string;
+  label?: string
-  autocomplete?: string;
+  autocomplete?: string
-  placeholder?: string;
+  placeholder?: string
 }
 
 export interface Textarea {
-  label?: string;
+  label?: string
-  name?: string;
+  name?: string
-  placeholder?: string;
+  placeholder?: string
-  rows?: number;
+  rows?: number
 }
 
 export interface Disclaimer {
-  label?: string;
+  label?: string
 }
 
 // COMPONENTS
 export interface CallToAction extends Omit<HTMLAttributes<'a'>, 'slot'> {
-  variant?: 'primary' | 'secondary' | 'tertiary' | 'link';
+  variant?: 'primary' | 'secondary' | 'tertiary' | 'link'
-  text?: string;
+  text?: string
-  icon?: string;
+  icon?: string
-  classes?: Record<string, string>;
+  classes?: Record<string, string>
-  type?: 'button' | 'submit' | 'reset';
+  type?: 'button' | 'submit' | 'reset'
 }
 
 export interface ItemGrid {
-  items?: Array<Item>;
+  items?: Array<Item>
-  columns?: number;
+  columns?: number
-  defaultIcon?: string;
+  defaultIcon?: string
-  classes?: Record<string, string>;
+  classes?: Record<string, string>
 }
 
 export interface Collapse {
-  iconUp?: string;
+  iconUp?: string
-  iconDown?: string;
+  iconDown?: string
-  items?: Array<Item>;
+  items?: Array<Item>
-  columns?: number;
+  columns?: number
-  classes?: Record<string, string>;
+  classes?: Record<string, string>
 }
 
 export interface Form {
-  inputs?: Array<Input>;
+  inputs?: Array<Input>
-  textarea?: Textarea;
+  textarea?: Textarea
-  disclaimer?: Disclaimer;
+  disclaimer?: Disclaimer
-  button?: string;
+  button?: string
-  description?: string;
+  description?: string
 }
 
 // WIDGETS
 export interface Hero extends Omit<Headline, 'classes'>, Widget {
-  content?: string;
+  content?: string
-  image?: string | unknown;
+  image?: string | unknown
-  callToAction1?: CallToAction;
+  callToAction1?: CallToAction
-  callToAction2?: CallToAction;
+  callToAction2?: CallToAction
-  isReversed?: boolean;
+  isReversed?: boolean
 }
 
 export interface Team extends Omit<Headline, 'classes'>, Widget {
-  team?: Array<TeamMember>;
+  team?: Array<TeamMember>
 }
 
 export interface Stats extends Omit<Headline, 'classes'>, Widget {
-  stats?: Array<Stat>;
+  stats?: Array<Stat>
 }
 
 export interface Pricing extends Omit<Headline, 'classes'>, Widget {
-  prices?: Array<Price>;
+  prices?: Array<Price>
 }
 
 export interface Testimonials extends Omit<Headline, 'classes'>, Widget {
-  testimonials?: Array<Testimonial>;
+  testimonials?: Array<Testimonial>
-  callToAction?: CallToAction;
+  callToAction?: CallToAction
 }
 
 export interface Brands extends Omit<Headline, 'classes'>, Widget {
-  icons?: Array<string>;
+  icons?: Array<string>
-  images?: Array<Image>;
+  images?: Array<Image>
 }
 
 export interface Features extends Omit<Headline, 'classes'>, Widget {
-  image?: string | unknown;
+  image?: string | unknown
-  video?: Video;
+  video?: Video
-  items?: Array<Item>;
+  items?: Array<Item>
-  columns?: number;
+  columns?: number
-  defaultIcon?: string;
+  defaultIcon?: string
-  callToAction1?: CallToAction;
+  callToAction1?: CallToAction
-  callToAction2?: CallToAction;
+  callToAction2?: CallToAction
-  isReversed?: boolean;
+  isReversed?: boolean
-  isBeforeContent?: boolean;
+  isBeforeContent?: boolean
-  isAfterContent?: boolean;
+  isAfterContent?: boolean
 }
 
 export interface Faqs extends Omit<Headline, 'classes'>, Widget {
-  iconUp?: string;
+  iconUp?: string
-  iconDown?: string;
+  iconDown?: string
-  items?: Array<Item>;
+  items?: Array<Item>
-  columns?: number;
+  columns?: number
 }
 
 export interface Steps extends Omit<Headline, 'classes'>, Widget {
   items: Array<{
-    title: string;
+    title: string
-    description?: string;
+    description?: string
-    icon?: string;
+    icon?: string
-    classes?: Record<string, string>;
+    classes?: Record<string, string>
-  }>;
+  }>
-  callToAction?: string | CallToAction;
+  callToAction?: string | CallToAction
-  image?: string | Image;
+  image?: string | Image
-  isReversed?: boolean;
+  isReversed?: boolean
 }
 
 export interface Content extends Omit<Headline, 'classes'>, Widget {
-  content?: string;
+  content?: string
-  image?: string | unknown;
+  image?: string | unknown
-  items?: Array<Item>;
+  items?: Array<Item>
-  columns?: number;
+  columns?: number
-  isReversed?: boolean;
+  isReversed?: boolean
-  isAfterContent?: boolean;
+  isAfterContent?: boolean
-  callToAction?: CallToAction;
+  callToAction?: CallToAction
 }
 
 export interface Contact extends Omit<Headline, 'classes'>, Form, Widget {}