From f80323fee6e66e81e8878a9dfb6e967cf505a1bf Mon Sep 17 00:00:00 2001
From: driccio <damien.riccio@4sh.fr>
Date: Tue, 31 Oct 2023 15:50:28 +0100
Subject: [PATCH] feat: add module and env edition pages

---
 .../src/lib/assets/lang/en/environment.json   |  8 ++++++
 modules/ui/src/lib/assets/lang/en/module.json |  7 +++++
 .../src/lib/assets/lang/fr/environment.json   |  8 ++++++
 modules/ui/src/lib/assets/lang/fr/module.json |  7 +++++
 .../O_environment/O_environmentEdition.svelte | 28 +++++++++++++++++++
 .../organisms/O_module/O_moduleEdition.svelte | 27 ++++++++++++++++++
 modules/ui/src/lib/services/EnvService.ts     | 17 +++++++++++
 modules/ui/src/lib/services/I18nService.ts    |  2 +-
 modules/ui/src/lib/services/ModuleService.ts  | 14 ++++++++++
 .../projects/[project]/envs/+page.svelte      | 17 ++++++++++-
 .../[project]/envs/[env]/edit/+page.svelte    |  8 ++++--
 .../projects/[project]/modules/+page.svelte   | 17 ++++++++++-
 .../modules/[module]/edit/+page.svelte        |  6 +++-
 13 files changed, 160 insertions(+), 6 deletions(-)
 create mode 100644 modules/ui/src/lib/assets/lang/en/environment.json
 create mode 100644 modules/ui/src/lib/assets/lang/en/module.json
 create mode 100644 modules/ui/src/lib/assets/lang/fr/environment.json
 create mode 100644 modules/ui/src/lib/assets/lang/fr/module.json
 create mode 100644 modules/ui/src/lib/components/organisms/O_environment/O_environmentEdition.svelte
 create mode 100644 modules/ui/src/lib/components/organisms/O_module/O_moduleEdition.svelte

diff --git a/modules/ui/src/lib/assets/lang/en/environment.json b/modules/ui/src/lib/assets/lang/en/environment.json
new file mode 100644
index 00000000..f5bcb4eb
--- /dev/null
+++ b/modules/ui/src/lib/assets/lang/en/environment.json
@@ -0,0 +1,8 @@
+{
+  "page": {
+    "creation": "Create environment",
+    "edition": "Edit environment {{environment.name}} of project {{projectName}}"
+  },
+  "name": "Name",
+  "smallName": "Small name"
+}
\ No newline at end of file
diff --git a/modules/ui/src/lib/assets/lang/en/module.json b/modules/ui/src/lib/assets/lang/en/module.json
new file mode 100644
index 00000000..d6a75980
--- /dev/null
+++ b/modules/ui/src/lib/assets/lang/en/module.json
@@ -0,0 +1,7 @@
+{
+  "page": {
+    "creation": "Create module",
+    "edition": "Edit module {{module.name}} of project {{projectName}}"
+  },
+  "name": "Name"
+}
\ No newline at end of file
diff --git a/modules/ui/src/lib/assets/lang/fr/environment.json b/modules/ui/src/lib/assets/lang/fr/environment.json
new file mode 100644
index 00000000..80571849
--- /dev/null
+++ b/modules/ui/src/lib/assets/lang/fr/environment.json
@@ -0,0 +1,8 @@
+{
+  "page": {
+    "creation": "Création d'un environnement",
+    "edition": "Édition de l'environnement {{environment.name}} du projet {{projectName}}"
+  },
+  "name": "Nom",
+  "smallName": "Nom court"
+}
\ No newline at end of file
diff --git a/modules/ui/src/lib/assets/lang/fr/module.json b/modules/ui/src/lib/assets/lang/fr/module.json
new file mode 100644
index 00000000..a0950bf4
--- /dev/null
+++ b/modules/ui/src/lib/assets/lang/fr/module.json
@@ -0,0 +1,7 @@
+{
+  "page": {
+    "creation": "Création d'un module",
+    "edition": "Édition du module {{module.name}} du projet {{projectName}}"
+  },
+  "name": "Nom"
+}
\ No newline at end of file
diff --git a/modules/ui/src/lib/components/organisms/O_environment/O_environmentEdition.svelte b/modules/ui/src/lib/components/organisms/O_environment/O_environmentEdition.svelte
new file mode 100644
index 00000000..ea800a9e
--- /dev/null
+++ b/modules/ui/src/lib/components/organisms/O_environment/O_environmentEdition.svelte
@@ -0,0 +1,28 @@
+<script lang="ts">
+    import M_inputText from "$lib/components/molecules/M_inputText.svelte";
+    import A_button from "$lib/components/atoms/A_button.svelte";
+    import {t} from "$lib/services/I18nService";
+    import type {Env} from "$lib/domain/Env";
+    import {EnvService} from "$lib/services/EnvService";
+
+    export let environment: Env = {} as Env;
+    export let projectRef;
+
+    function save() {
+        if (environment.id) {
+            EnvService.updateName(environment);
+        } else {
+            EnvService.create(projectRef, environment);
+        }
+    }
+</script>
+
+<form on:submit|preventDefault={save}>
+    <M_inputText label="{$t('environment.name')}" bind:value={environment.name} required="true" placeholder="{$t('environment.name')}"/>
+    <M_inputText label="{$t('project.smallName')}" bind:value={environment.smallName} required="true" placeholder="{$t('environment.smallName')}"/>
+
+    <A_button label="{$t('common.actions.save')}" type="submit"/>
+</form>
+
+<style>
+</style>
diff --git a/modules/ui/src/lib/components/organisms/O_module/O_moduleEdition.svelte b/modules/ui/src/lib/components/organisms/O_module/O_moduleEdition.svelte
new file mode 100644
index 00000000..5c1401eb
--- /dev/null
+++ b/modules/ui/src/lib/components/organisms/O_module/O_moduleEdition.svelte
@@ -0,0 +1,27 @@
+<script lang="ts">
+    import M_inputText from "$lib/components/molecules/M_inputText.svelte";
+    import A_button from "$lib/components/atoms/A_button.svelte";
+    import {t} from "$lib/services/I18nService";
+    import type {Module} from "$lib/domain/Module";
+    import {ModuleService} from "$lib/services/ModuleService";
+
+    export let module: Module = {} as Module;
+    export let projectRef;
+
+    function save() {
+        if (module.id) {
+            ModuleService.updateName(module);
+        } else {
+            ModuleService.create(projectRef, module);
+        }
+    }
+</script>
+
+<form on:submit|preventDefault={save}>
+    <M_inputText label="{$t('module.name')}" bind:value={module.name} required="true" placeholder="{$t('module.name')}"/>
+
+    <A_button label="{$t('common.actions.save')}" type="submit"/>
+</form>
+
+<style>
+</style>
diff --git a/modules/ui/src/lib/services/EnvService.ts b/modules/ui/src/lib/services/EnvService.ts
index 0c28a0f1..71daab36 100644
--- a/modules/ui/src/lib/services/EnvService.ts
+++ b/modules/ui/src/lib/services/EnvService.ts
@@ -1,4 +1,5 @@
 import type {Env} from "$lib/domain/Env";
+import {Http} from "$lib/services/utils/HttpService";
 
 
 export class EnvService {
@@ -8,4 +9,20 @@ export class EnvService {
         const res = await fetch(`${EnvService.baseUrl}/${id}`);
         return (await res.json()) as Env;
     }
+
+
+    public static create = async (projectRef: string, env: Env) => {
+        return Http.post(`${EnvService.baseUrl}`, {
+            name: env.name,
+            smallName: env.smallName,
+            projectRef
+        });
+    }
+
+    public static updateName = async (env: Env): Promise<Env> => {
+        return Http.put(`${EnvService.baseUrl}/${env.id}/name`, {
+            name: env.name,
+            smallName: env.smallName
+        });
+    }
 }
diff --git a/modules/ui/src/lib/services/I18nService.ts b/modules/ui/src/lib/services/I18nService.ts
index 2b9049c9..25b9be21 100644
--- a/modules/ui/src/lib/services/I18nService.ts
+++ b/modules/ui/src/lib/services/I18nService.ts
@@ -1,7 +1,7 @@
 import i18n from 'sveltekit-i18n';
 
 const languages = ['en', 'fr'];
-const i18nFiles = ['common', 'app', 'project'];
+const i18nFiles = ['common', 'app', 'project', 'module', 'environment'];
 
 const langFilePairs: any[] = languages
     .flatMap(lang => i18nFiles.map(i18nFile => ({lang, i18nFile})));
diff --git a/modules/ui/src/lib/services/ModuleService.ts b/modules/ui/src/lib/services/ModuleService.ts
index 2243ac14..9237a167 100644
--- a/modules/ui/src/lib/services/ModuleService.ts
+++ b/modules/ui/src/lib/services/ModuleService.ts
@@ -1,4 +1,5 @@
 import type {Module} from "$lib/domain/Module";
+import {Http} from "$lib/services/utils/HttpService";
 
 
 export class ModuleService {
@@ -8,4 +9,17 @@ export class ModuleService {
         const res = await fetch(`${ModuleService.baseUrl}/${id}`);
         return (await res.json()) as Module;
     }
+
+    public static create = async (projectRef: string, module: Module) => {
+        return Http.post(`${ModuleService.baseUrl}`, {
+            name: module.name,
+            projectRef
+        });
+    }
+
+    public static updateName = async (module: Module): Promise<Module> => {
+        return Http.put(`${ModuleService.baseUrl}/${module.id}/name`, {
+            name: module.name
+        });
+    }
 }
diff --git a/modules/ui/src/routes/projects/[project]/envs/+page.svelte b/modules/ui/src/routes/projects/[project]/envs/+page.svelte
index 520d998b..aa6ed226 100644
--- a/modules/ui/src/routes/projects/[project]/envs/+page.svelte
+++ b/modules/ui/src/routes/projects/[project]/envs/+page.svelte
@@ -1 +1,16 @@
-Page de creation d'un environnement
\ No newline at end of file
+<script lang="ts">
+    import { t } from '$lib/services/I18nService';
+    import {page} from "$app/stores";
+    import O_environmentEdition from "$lib/components/organisms/O_environment/O_environmentEdition.svelte";
+
+    let environment = {};
+    let projectRef;
+
+    $: if($page.params?.project) {
+        projectRef = $page.params.project;
+    }
+</script>
+
+{$t('environment.page.creation')}
+
+<O_environmentEdition {projectRef} {environment} />
diff --git a/modules/ui/src/routes/projects/[project]/envs/[env]/edit/+page.svelte b/modules/ui/src/routes/projects/[project]/envs/[env]/edit/+page.svelte
index 6b9e7320..99c55915 100644
--- a/modules/ui/src/routes/projects/[project]/envs/[env]/edit/+page.svelte
+++ b/modules/ui/src/routes/projects/[project]/envs/[env]/edit/+page.svelte
@@ -3,6 +3,8 @@
     import {page} from "$app/stores";
     import {ProjectService} from "$lib/services/ProjectService";
     import M_error from "$lib/components/molecules/M_error.svelte";
+    import {t} from "$lib/services/I18nService";
+    import O_environmentEdition from "$lib/components/organisms/O_environment/O_environmentEdition.svelte";
 
     let project
     let envPromise
@@ -20,8 +22,10 @@
 
 {#await envPromise}
     <p>...waiting</p>
-{:then env}
-    Edition de l'environnement {env.name} du projet {project.name}
+{:then environment}
+    {$t('environment.page.edition', {name: environment.name, projectName: project.name})}
+
+    <O_environmentEdition projectRef="{project.id}" {environment}/>
 {:catch error}
     <M_error>
         Env not found !
diff --git a/modules/ui/src/routes/projects/[project]/modules/+page.svelte b/modules/ui/src/routes/projects/[project]/modules/+page.svelte
index 57613dba..867ef1b7 100644
--- a/modules/ui/src/routes/projects/[project]/modules/+page.svelte
+++ b/modules/ui/src/routes/projects/[project]/modules/+page.svelte
@@ -1 +1,16 @@
-Page de creation d'un module
\ No newline at end of file
+<script lang="ts">
+    import { t } from '$lib/services/I18nService';
+    import O_moduleEdition from "$lib/components/organisms/O_module/O_moduleEdition.svelte";
+    import {page} from "$app/stores";
+
+    let module = {};
+    let projectRef;
+
+    $: if($page.params?.project) {
+        projectRef = $page.params.project;
+    }
+</script>
+
+{$t('module.page.creation')}
+
+<O_moduleEdition {projectRef} {module} />
\ No newline at end of file
diff --git a/modules/ui/src/routes/projects/[project]/modules/[module]/edit/+page.svelte b/modules/ui/src/routes/projects/[project]/modules/[module]/edit/+page.svelte
index d4d15b7e..f1f47930 100644
--- a/modules/ui/src/routes/projects/[project]/modules/[module]/edit/+page.svelte
+++ b/modules/ui/src/routes/projects/[project]/modules/[module]/edit/+page.svelte
@@ -5,6 +5,8 @@
     import {EnvService} from "$lib/services/EnvService";
     import {ExecutionMock} from "$lib/mocks/ExecutionMock";
     import M_error from "$lib/components/molecules/M_error.svelte";
+    import {t} from "$lib/services/I18nService";
+    import O_moduleEdition from "$lib/components/organisms/O_module/O_moduleEdition.svelte";
 
     let project
     let env
@@ -35,7 +37,9 @@
 {#await modulePromise}
     <p>...waiting</p>
 {:then module}
-    Edition du module {module.name} du projet {project.name}
+    {$t('module.page.edition', {name: module.name, projectName: project.name})}
+
+    <O_moduleEdition projectRef="{project.id}" {module}/>
 {:catch error}
     <M_error>
         Module not found !