feat: input and history pages

src/App.vue

@@ -1,15 +1,11 @@
 <script setup lang="ts">
 import { ref, onMounted, onBeforeMount } from "vue";
 import PageRandom from "@/components/PageRandom.vue";
-// import PageInput from "@/components/PageInput.vue";
+import PageInput from "@/components/PageInput.vue";
 import { DomainFactory } from "@/lib/factory";
-
-function getLang() {
-  return document.location.hash === "#french" ? "french" : "english";
-}
+import PageHistory from "./components/PageHistory.vue";
 
 const visible = ref<boolean>(false);
-const lang = ref<string>(getLang());
 const factory = ref<DomainFactory>(new DomainFactory());
 
 onBeforeMount(() => {
@@ -20,12 +16,6 @@ onMounted(() => {
   setTimeout(() => {
     visible.value = true;
   });
-  setInterval(() => {
-    const newLang = getLang();
-    if (newLang !== lang.value) {
-      lang.value = newLang;
-    }
-  }, 100);
 });
 </script>
 
@@ -36,27 +26,40 @@ onMounted(() => {
         type="radio"
         name="app_tabs"
         class="tab"
-        :aria-label="lang === 'french' ? 'Aléatoire' : 'Random'"
+        :aria-label="$t('tab.random')"
         checked
       />
       <div
         class="tab-content bg-base-100 border-base-300 shadow-2xl p-6 overflow-hidden"
       >
-        <PageRandom :lang="lang" :factory="factory" />
+        <PageRandom :factory="factory" />
       </div>
 
-      <!-- <input
+      <input
         type="radio"
         name="app_tabs"
         class="tab"
-        :aria-label="lang === 'french' ? 'Saisie' : 'Input'"
+        :aria-label="$t('tab.input')"
         checked
       />
       <div
         class="tab-content bg-base-100 border-base-300 shadow-2xl p-6 overflow-hidden"
       >
-        <PageInput :lang="lang" :factory="factory" />
-      </div> -->
+        <PageInput :factory="factory" />
+      </div>
+
+      <input
+        type="radio"
+        name="app_tabs"
+        class="tab"
+        :aria-label="$t('tab.history')"
+        checked
+      />
+      <div
+        class="tab-content bg-base-100 border-base-300 shadow-2xl p-6 overflow-x-hidden overflow-y-scroll max-h-96"
+      >
+        <PageHistory :factory="factory" />
+      </div>
     </div>
   </div>
 </template>