login okay

front/.eslintignore

@@ -0,0 +1,8 @@
+node_modules
+
+out
+.next
+
+next-env.d.ts
+*.js
+__tests__

front/.eslintrc.json

@@ -0,0 +1,324 @@
+{
+	"env": {
+		"browser": true,
+		"es6": true,
+		"node": true
+	},
+	"extends": [
+		"eslint:recommended",
+		"plugin:astro/recommended",
+		"plugin:@typescript-eslint/strict",
+		"plugin:@typescript-eslint/stylistic"
+	],
+	"globals": {
+		"Atomics": "readonly",
+		"SharedArrayBuffer": "readonly"
+	},
+	"overrides": [
+		{
+			"files": [
+				"*.astro"
+			],
+			"parser": "astro-eslint-parser",
+			"parserOptions": {
+				"extraFileExtensions": [
+					".astro"
+				],
+				"parser": "@typescript-eslint/parser"
+			}
+		},
+		{
+			"files": [
+				"*.ts",
+				"*.tsx",
+				"*.astro"
+			],
+			"rules": {
+				"no-extra-parens": "off",
+				"no-unused-expressions": "off",
+				"no-shadow": "off",
+				"quotes": "off",
+				"semi": "off",
+				"space-before-function-paren": "off"
+			}
+		}
+	],
+	"parser": "@typescript-eslint/parser",
+	"parserOptions": {
+		"ecmaFeatures": {
+			"jsx": true,
+			"project": "tsconfig.json",
+			"sourceType": "module",
+			"ecmaVersion": 2018
+		}
+	},
+	"plugins": [
+		"@typescript-eslint"
+	],
+	"root": true,
+	"rules": {
+		"@typescript-eslint/prefer-for-of": "error",
+		"@typescript-eslint/prefer-function-type": "error",
+		"@typescript-eslint/prefer-namespace-keyword": "error",
+		"@typescript-eslint/space-before-function-paren": [
+			"error",
+			{
+				"anonymous": "never",
+				"asyncArrow": "always",
+				"named": "never"
+			}
+		],
+		"@typescript-eslint/triple-slash-reference": "error",
+		"@typescript-eslint/type-annotation-spacing": "error",
+		"@typescript-eslint/unified-signatures": "error",
+
+		"@typescript-eslint/adjacent-overload-signatures": "error",
+		"@typescript-eslint/array-type": [
+			"error",
+			{
+				"default": "generic"
+			}
+		],
+		"arrow-body-style": "error",
+		"arrow-parens": [
+			"error",
+			"always"
+		],
+		"@typescript-eslint/ban-types": [
+			"error",
+			{
+				"types": {
+					"{}": false
+				}
+			}
+		],
+		"complexity": [
+			"warn",
+			10
+		],
+		"@typescript-eslint/consistent-type-assertions": "error",
+		"@typescript-eslint/consistent-type-definitions": "error",
+		"constructor-super": "error",
+		"curly": "error",
+		"dot-notation": "error",
+		"eol-last": "error",
+		"eqeqeq": [
+			"error",
+			"smart"
+		],
+		"@typescript-eslint/explicit-member-accessibility": [
+			"error",
+			{
+				"accessibility": "explicit"
+			}
+		],
+		"for-direction": "error",
+		"getter-return": "error",
+		"guard-for-in": "error",
+		"id-blacklist": [
+			"error",
+			"any",
+			"Number",
+			"number",
+			"String",
+			"string",
+			"Boolean",
+			"boolean",
+			"Undefined"
+		],
+		"id-length": [
+			"warn",
+			{
+				"exceptions": [
+					"_"
+				]
+			}
+		],
+		"id-match": "error",
+		"indent": [
+			"error",
+			"tab",
+			{
+				"SwitchCase": 1
+			}
+		],
+		"linebreak-style": [
+			"error",
+			"unix"
+		],
+		"max-classes-per-file": [
+			"error",
+			1
+		],
+		"max-depth": [
+			"warn",
+			2
+		],
+		"max-len": [
+			"warn",
+			{
+				"code": 256
+			}
+		],
+		"@typescript-eslint/member-delimiter-style": [
+			"error",
+			{
+				"multiline": {
+					"delimiter": "none",
+					"requireLast": true
+				},
+				"singleline": {
+					"delimiter": "comma",
+					"requireLast": false
+				}
+			}
+		],
+		"@typescript-eslint/member-ordering": "error",
+		"new-parens": "error",
+
+		"no-async-promise-executor": "error",
+		"no-await-in-loop": "warn",
+		"no-bitwise": "error",
+		"no-caller": "error",
+		"no-compare-neg-zero": "error",
+		"no-cond-assign": "error",
+		"no-console": "off",
+		"no-constant-condition": "error",
+		"no-control-regex": "warn",
+		"no-debugger": "error",
+		"no-delete-var": "error",
+		"no-dupe-args": "error",
+		"no-dupe-else-if": "error",
+		"no-dupe-keys": "error",
+		"no-duplicate-case": "error",
+		"no-empty": [
+			"error",
+			{
+				"allowEmptyCatch": true
+			}
+		],
+		"no-empty-character-class": "error",
+		"@typescript-eslint/no-empty-function": "error",
+		"@typescript-eslint/no-empty-interface": "error",
+		"no-eval": "error",
+		"no-ex-assign": "error",
+		"@typescript-eslint/no-explicit-any": "off",
+
+
+		"no-extra-boolean-cast": "error",
+		"no-extra-parens": "off",
+		"@typescript-eslint/no-extra-parens": [
+			"error",
+			"all",
+			{
+				"ignoreJSX": "all"
+			}
+		],
+		"no-extra-semi": "error",
+		"no-fallthrough": "off",
+		"no-func-assign": "error",
+		"no-import-assign": "error",
+		"no-inner-declarations": "error",
+		"no-invalid-regexp": "error",
+		"no-irregular-whitespace": "error",
+		"no-label-var": "error",
+		"no-loss-of-precision": "error",
+		"no-misleading-character-class": "error",
+		"@typescript-eslint/no-misused-new": "error",
+		"no-multiple-empty-lines": "error",
+		"@typescript-eslint/no-namespace": "error",
+		"no-new-wrappers": "error",
+		"no-obj-calls": "error",
+		"no-promise-executor-return": "error",
+		"@typescript-eslint/no-parameter-properties": "off",
+		"no-prototype-builtins": "error",
+		"no-regex-spaces": "error",
+		"no-setter-return": "error",
+		"@typescript-eslint/no-shadow": "error",
+		"no-shadow": [
+			"error",
+			{
+				"builtinGlobals": false,
+				"hoist": "all"
+			}
+		],
+		"no-shadow-restricted-names": "error",
+		"no-sparse-arrays": "error",
+		"no-template-curly-in-string": "warn",
+		"no-throw-literal": "error",
+		"no-trailing-spaces": "error",
+		"no-undef": "error",
+		"no-undef-init": "error",
+		"no-underscore-dangle": "off",
+		"no-unexpected-multiline": "error",
+		"no-unreachable": "warn",
+		"no-unreachable-loop": "warn",
+		"no-unsafe-finally": "error",
+		"no-unsafe-negation": "error",
+		"no-unsafe-optional-chaining": "error",
+		"no-unused-expressions": [
+			"error",
+			{
+				"allowTernary": true
+			}
+		],
+		"@typescript-eslint/no-unused-expressions": [
+			"error",
+			{
+				"allowTernary": true
+			}
+		],
+		"no-unused-labels": "error",
+		"no-unused-vars": "off",
+		"@typescript-eslint/no-unused-vars": ["error", {
+			"args": "all",
+			"argsIgnorePattern": "^_",
+			"caughtErrors": "all",
+			"caughtErrorsIgnorePattern": "^_",
+			"destructuredArrayIgnorePattern": "^_",
+			"varsIgnorePattern": "^_",
+			"ignoreRestSiblings": true
+		}],
+		"@typescript-eslint/no-non-null-assertion": ["warn"],
+		"no-var": "error",
+		"object-shorthand": [
+			"warn",
+			"methods"
+		],
+		"one-var": [
+			"error",
+			"never"
+		],
+		"prefer-const": "error",
+		"quote-props": [
+			"error",
+			"consistent-as-needed"
+		],
+		"quotes": "off",
+		"@typescript-eslint/quotes": [
+			"error",
+			"single",
+			{
+				"avoidEscape": true
+			}
+		],
+		"radix": "error",
+		"require-atomic-updates": "warn",
+		"semi": "off",
+		"@typescript-eslint/semi": [
+			"error",
+			"never"
+		],
+		"space-before-function-paren": [
+			"error",
+			{
+				"anonymous": "never",
+				"asyncArrow": "always",
+				"named": "never"
+			}
+		],
+		"spaced-comment": ["error", "always", { "block": { "exceptions": ["*"] } }],
+		"use-isnan": "error",
+		"valid-typeof": "warn"
+	}
+}

front/.vscode/settings.json

@@ -0,0 +1,9 @@
+{
+	"editor.quickSuggestions": {
+		"strings": "on"
+	},
+	"tailwindCSS.includeLanguages": {
+		"astro": "html"
+	},
+	"typescript.tsdk": "node_modules/typescript/lib"
+}

front/astro.config.mjs

@@ -1,30 +1,29 @@
-import { defineConfig } from 'astro/config';
+import node from '@astrojs/node'
-import node from '@astrojs/node';
+import tailwind from '@astrojs/tailwind'
-import tailwind from "@astrojs/tailwind";
+import { defineConfig } from 'astro/config'
 
-import react from "@astrojs/react";
+import react from '@astrojs/react'
 
 // https://astro.build/config
 export default defineConfig({
-  // integrations: [tailwind(), test, routing(), version(), buildInfos()],
+	compressHTML: true,
-  compressHTML: true,
+	build: {
-  build: {
+		assets: 'assets',
-    assets: 'assets',
+		inlineStylesheets: 'auto'
-    inlineStylesheets: 'auto'
+	},
-  },
+	server: {
-  server: {
+		host: true,
-    host: true,
+		port: 3000
-    port: 3000
+	},
-  },
+	trailingSlash: 'never',
-  trailingSlash: 'never',
+	output: 'server',
-  output: 'server',
+	adapter: node({
-  adapter: node({
+		mode: 'standalone'
-    mode: 'standalone'
+	}),
-  }),
+	integrations: [tailwind(), react()],
-  integrations: [tailwind(), react()],
+	vite: {
-  vite: {
+		optimizeDeps: {
-    optimizeDeps: {
+			include: ['leaflet']
-      include: ['leaflet']
+		}
-    }
+	}
-  }
+})
-});

front/package.json

@@ -27,10 +27,11 @@
     "react-leaflet": "^4.2.1",
     "simple-icons-astro": "^11.12.0",
     "tailwindcss": "^3.4.3",
-    "typescript": "^5.2.2"
+    "typescript": "^5"
   },
   "devDependencies": {
     "@astrojs/check": "^0",
+    "@astrojs/ts-plugin": "^1.6.1",
     "@types/leaflet": "^1.9.12",
     "@types/node": "^20",
     "@typescript-eslint/eslint-plugin": "^6.21.0",

front/src/env.d.ts

@@ -1 +1,25 @@
+/// <reference path="../.astro/types.d.ts" />
 /// <reference types="astro/client" />
+
+import PocketBase from 'pocketbase'
+export interface ImportMetaEnv {
+    NODE_ENV: string
+    APP_URL: string
+
+    POCKETBASE_URL: string
+
+	GOOGLE_API_KEY: string
+}
+
+interface ImportMeta {
+	readonly env: ImportMetaEnv
+}
+
+
+// eslint-disable-next-line  @typescript-eslint/no-namespace
+declare namespace App {
+	// eslint-disable-next-line  @typescript-eslint/no-empty-interface
+	export interface Locals {
+		pb: PocketBase
+	}
+}

front/src/layouts/Layout.astro

@@ -20,32 +20,3 @@ const { title } = Astro.props;
 		<slot />
 	</body>
 </html>
-<style is:global>
-	:root {
-		--accent: 136, 58, 234;
-		--accent-light: 224, 204, 250;
-		--accent-dark: 49, 10, 101;
-		--accent-gradient: linear-gradient(
-			45deg,
-			rgb(var(--accent)),
-			rgb(var(--accent-light)) 30%,
-			white 60%
-		);
-	}
-	html {
-		font-family: system-ui, sans-serif;
-		background: #13151a;
-		background-size: 224px;
-	}
-	code {
-		font-family:
-			Menlo,
-			Monaco,
-			Lucida Console,
-			Liberation Mono,
-			DejaVu Sans Mono,
-			Bitstream Vera Sans Mono,
-			Courier New,
-			monospace;
-	}
-</style>

front/src/libs/AstroUtils.ts

@@ -0,0 +1,5 @@
+export default class AstroUtils {
+	public static async wrap<T = void>(fn: () => T | Promise<T>) {
+		return await fn()
+	}
+}

front/src/libs/AuthUtils.ts

@@ -1,12 +1,107 @@
-
+import type { AstroCookies } from 'astro'
-//référence a loop
+import type UserObj from 'models/User'
-//fonction get user pour récupéré un utilisateur (notament coté client)
+import PocketBase from 'pocketbase'
-//sessionID = JWS
+import { getEnv } from 'libs/Env'
 
 
-//fonction set user crée un cookies de session
+const pb = new PocketBase(getEnv('POCKETBASE_URL','https://pb-tweb.cb85.fr')) // XXX: 'https://pb-tweb.cb85.fr'
-//passé le cookies astro dans les paramètre
 
-//utiliser cookie.set pour crée un nouveau cookies
+export async function clearUser(cookies: AstroCookies): Promise<void> {
+	const sessionID = cookies.get('session')?.value
 
+	if(!sessionID){
+		return
+	}
 
+	cookies.delete('session',{
+		path: '/'
+	})
+}
+
+export async function login(cookies: AstroCookies, user: {user: string, password: string}): Promise<boolean> {
+
+	const authData = await pb.collection('users').authWithPassword(user.user, user.password)
+
+	let secure = true
+
+	if (getEnv('NODE_ENV', 'production') !== 'production') {
+		secure = false
+	}
+
+	if(authData){
+		cookies.set('session', authData.token,{
+			httpOnly: true,
+			path: '/',
+			secure: secure,
+			sameSite: 'strict',
+			maxAge: 365000,
+		})
+		return true
+	}
+	return false
+}
+
+export async function getUser(cookies: AstroCookies): Promise<UserObj | null> {
+	const sessionID = cookies.get('session')?.value
+
+	const bpAuth = pb.authStore
+
+	if(!sessionID){
+		return null
+	}
+	if(!bpAuth.isValid){
+		return null
+	}
+	if(!bpAuth){
+		return null
+	}
+
+	console.log(bpAuth.model)
+
+	if(!bpAuth.model){
+		return null
+	}
+
+	const output: UserObj = {
+		id: bpAuth.model.id as string,
+		collectionId: bpAuth.model.collectionId as string,
+		collectionName: bpAuth.model.collectionName as string,
+		created: bpAuth.model.created as string,
+		updated: bpAuth.model.updated as string,
+		avatar: bpAuth.model.avatar as string,
+		username: bpAuth.model.username as string,
+		email: bpAuth.model.email as string,
+		emailVisibility: false,
+		name: bpAuth.model.name as string,
+		password: undefined,
+		passwordConfirm: undefined,
+	}
+
+	return output
+
+}
+
+export async function setUser(cookies: AstroCookies, user: UserObj): Promise<void>{
+
+	const record = await pb.collection('users').create(user)
+
+	console.log(record)
+
+	const session = pb.authStore.token
+
+	console.log(session)
+
+	let secure = true
+
+	if (getEnv('NODE_ENV', 'production') !== 'production') {
+		secure = false
+	}
+
+	cookies.set('session', session,{
+		httpOnly: true,
+		path: '/',
+		secure: secure,
+		sameSite: 'strict',
+		maxAge: 365000,
+	})
+}

front/src/libs/Env.ts

@@ -0,0 +1,17 @@
+import type { ImportMetaEnv } from 'env'
+
+/**
+ * Get the environment variable
+ *
+ * @param key the env variable key
+ * @param defaultValue a default value if applicable
+ * @returns the environment value or undefined if not found
+ */
+export function getEnv(key: keyof ImportMetaEnv, defaultValue: string): string
+export function getEnv(key: keyof ImportMetaEnv, defaultValue?: string | undefined): string | undefined
+export function getEnv(key: keyof ImportMetaEnv, defaultValue?: string | undefined): string | undefined {
+	// get the env variable through Astro > NodeJS > input
+	const res = import.meta.env[key] ?? process.env[key] ?? defaultValue
+
+	return res ?? undefined
+}

front/src/middleware/index.ts

@@ -0,0 +1,27 @@
+import PocketBase from 'pocketbase'
+
+import { defineMiddleware } from 'astro/middleware'
+import { getEnv } from 'libs/Env'
+
+export const onRequest = defineMiddleware(async ({ locals, request }: any, next: () => any) => {
+	locals.pb = new PocketBase(getEnv('POCKETBASE_URL','http://localhost:8080'))
+
+	// load the store data from the request cookie string
+	locals.pb.authStore.loadFromCookie(request.headers.get('cookie') || '')
+
+	try {
+		// get an up-to-date auth store state by verifying and refreshing the loaded auth model (if any)
+		// eslint-disable-next-line @typescript-eslint/no-unused-expressions
+		locals.pb.authStore.isValid && await locals.pb.collection('users').authRefresh()
+	} catch (_) {
+		// clear the auth store on failed refresh
+		locals.pb.authStore.clear()
+	}
+
+	const response = await next()
+
+	// send back the default 'pb_auth' cookie to the client with the latest store state
+	response.headers.append('set-cookie', locals.pb.authStore.exportToCookie())
+
+	return response
+})

front/src/models/User/index.ts

@@ -0,0 +1,19 @@
+
+
+export interface PBData{
+    id?: string | null
+    collectionId?: string | null
+    collectionName?: string | null
+    created?: string | null // TODO: passé ca en date auto
+    updated?: string | null // TODO: passé ca en date auto
+}
+
+export default interface UserObj extends PBData{
+    avatar?: string | null
+    username: string
+    email: string
+    emailVisibility?: boolean
+    password?: string | undefined
+    passwordConfirm?: string | undefined
+    name: string | null
+}

front/src/pages/account/index.astro

@@ -0,0 +1,18 @@
+---
+import Layout from 'layouts/Layout.astro'
+import PocketBase from 'pocketbase'
+
+
+const pb = Astro.locals.pb as PocketBase
+const auth = pb.authStore
+const user = auth.model
+
+if(!auth.isValid){
+    return Astro.redirect("/account/login");
+}
+
+---
+
+<Layout title="Account setting">
+    <h1>Bonjour {user!.name}</h1>
+</Layout>

front/src/pages/account/login.astro

@@ -0,0 +1,43 @@
+---
+import Layout from "layouts/Layout.astro";
+import AstroUtils from "libs/AstroUtils";
+import PocketBase from 'pocketbase'
+
+
+const pb = Astro.locals.pb as PocketBase
+
+if(pb.authStore.isValid){
+    return Astro.redirect("/account")
+}
+
+const res = await AstroUtils.wrap(async () => {
+    if (Astro.request.method !== 'POST') {
+        return
+    }
+    // FIXME checké si utilisateur deja connecté
+    const locals = Astro.locals
+    
+    const form = await Astro.request.formData();
+    const request = {
+        user: form.get("username") as string,
+        password: form.get("password") as string
+    }
+
+    try {
+        await locals.pb.collection('users').authWithPassword(request.user,request.password);
+    } catch (error) {
+        console.log(error)
+    }
+
+    return Astro.redirect("/account")
+
+})
+---
+
+<Layout title="login">
+    <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" />
+        <button>Connection</button>
+    </form>
+</Layout>

front/src/pages/account/register.astro

@@ -0,0 +1,43 @@
+---
+import Layout from 'layouts/Layout.astro';
+import AstroUtils from 'libs/AstroUtils';
+import PocketBase from 'pocketbase'
+
+
+const pb = Astro.locals.pb as PocketBase
+
+if(pb.authStore.isValid){
+    return Astro.redirect("/account")
+}
+
+await AstroUtils.wrap(async () => {
+    if (Astro.request.method !== 'POST'){
+        return
+    }
+    const form = await Astro.request.formData()
+    const request = {
+        username: form.get("username") as string,
+        name: form.get("name") as string,
+        email: form.get("email") as string,
+        password: form.get("password") as string,
+        passwordConfirm: form.get("passwordConfirm") as string,
+    }
+    try{
+        await pb.collection('users').create(request)
+        return Astro.redirect('account/login')
+    }catch(e){
+        console.log(e);
+    }
+})
+---
+
+<Layout title="register">
+    <form id="account-creation" method="post" enctype="multipart/form-data">
+        <input required name="name" placeholder="Prénom Nom"/>
+        <input required name="username" placeholder="Pseudo"/>
+        <input required name="email" type="email" placeholder="Renseignez votre email" />
+        <input required name="password" type="password" placeholder="Créez un mot de passe" />
+        <input required name="passwordConfirm" type="password" placeholder="Confirmer votre mot de passe" />
+        <button>Créer un compte</button>
+    </form>
+</Layout>

front/tsconfig.json

@@ -5,4 +5,7 @@
 		// hide an issue with typescript
 		"noUnusedLocals": false
 	},
+	"ts-node": {
+		"esm": true
+	}
 }