build: switch from yarn to npm to manage js dependencies and move js contents to root

yarn v1 is being deprecated and starts to have some issues

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

src/components/User/AuthProvider.vue

@@ -0,0 +1,35 @@
+<template>
+  <o-button
+    tag="a"
+    outlined
+    variant="primary"
+    :icon-left="oauthProvider.id"
+    v-if="isProviderSelected && !oauthProvider.label"
+    :href="`/auth/${oauthProvider.id}`"
+  >
+    <span>{{ SELECTED_PROVIDERS[oauthProvider.id] }}</span></o-button
+  >
+  <o-button
+    tag="a"
+    outlined
+    variant="primary"
+    :href="`/auth/${oauthProvider.id}`"
+    v-else-if="isProviderSelected"
+    icon-left="lock"
+  >
+    <span>{{ oauthProvider.label }}</span>
+  </o-button>
+</template>
+<script lang="ts" setup>
+import { computed } from "vue";
+import { IOAuthProvider } from "@/types/config.model";
+import { SELECTED_PROVIDERS } from "@/utils/auth";
+
+const props = defineProps<{
+  oauthProvider: IOAuthProvider;
+}>();
+
+const isProviderSelected = computed((): boolean => {
+  return Object.keys(SELECTED_PROVIDERS).includes(props.oauthProvider.id);
+});
+</script>

src/components/User/AuthProviders.story.vue

@@ -0,0 +1,13 @@
+<template>
+  <Story>
+    <Variant title="Public">
+      <AuthProviders :oauthProviders="providers" />
+    </Variant>
+  </Story>
+</template>
+
+<script lang="ts" setup>
+import AuthProviders from "./AuthProviders.vue";
+
+const providers = [{ id: "keycloak", label: "Entreprise" }, { id: "google" }];
+</script>

src/components/User/AuthProviders.vue

@@ -0,0 +1,23 @@
+<template>
+  <div>
+    <b>{{ t("Sign in with") }}</b>
+    <div class="flex gap-1 flex-wrap">
+      <auth-provider
+        v-for="provider in oauthProviders"
+        :oauthProvider="provider"
+        :key="provider.id"
+      />
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+import { useI18n } from "vue-i18n";
+import { IOAuthProvider } from "@/types/config.model";
+import AuthProvider from "./AuthProvider.vue";
+
+defineProps<{
+  oauthProviders: IOAuthProvider[];
+}>();
+
+const { t } = useI18n({ useScope: "global" });
+</script>