Merge pull request #7 from miku0129/development

Add authentication and test.

.env.example

@@ -0,0 +1 @@
+VITE_HANKO_API_URL_LOCAL=

.gitignore

@@ -23,4 +23,6 @@ dist-ssr
 *.sln
 *.sw?
 
-sample-student-data.ts
+sample-student-data.ts
+.env
+coverage

@types/index.d.ts

@@ -0,0 +1,16 @@
+interface FormContent {
+  id:number; 
+  name: string;
+  email: string;
+  fromWhen?: string;
+  myGoal?: string;
+  myMethod?: string;
+}
+
+interface showForm {
+  bool: boolean
+}
+
+interface isEditVal {
+  bool: boolean
+}

README.md

@@ -2,15 +2,9 @@
 
 * [TypeScript](https://www.typescriptlang.org/), [Vue3](https://vuejs.org/), [Vite](https://vitejs.dev/) for development.
   * Using Github to manage code (versioning, issues, pull request...)
-* Use OVH web-hosting for production.
+  * Applied [Hanko](https://www.hanko.io/) for authentication. 
+* Use [OVH](https://www.ovhcloud.com/fr/) web-hosting for production.
   * Use FileZilla for production deployment.
+* Implemented unit test with [jest](https://jestjs.io/) and [Vue Test Utils](https://test-utils.vuejs.org/) 
 
 <img src=https://media.giphy.com/media/v1.Y2lkPTc5MGI3NjExd2JoNDNyYmVmaHlpMGFscTh2cWtpM25uZnIybGhnNjdmdTRwbTc1cCZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/rkaKsUP1LHq9ndg1w9/giphy.gif>
-
-# Future feature 
-
-* Allow user to create an account
-* Add user authentication
-* Allow user to edit it's profile
-* ~~Implements CI/CD with Github Actions~~
-* ~~Add tests for UI~~

babel.config.cjs

@@ -1,11 +1,21 @@
+// Only used by Jest
 module.exports = {
-    env: {
-      test: {
-        presets: [
-          ["@babel/preset-env", { targets: { node: "current" } }],
-          "@babel/preset-typescript",
-        ],
-      },
+  presets: [
+    [
+      '@babel/preset-env',
+      { useBuiltIns: 'entry', corejs: '2', targets: { node: 'current' } },
+    ],
+    '@babel/preset-typescript',
+  ],
+  plugins: [
+    function () {
+      return {
+        visitor: {
+          MetaProperty(path) {
+            path.replaceWithSourceString('process')
+          },
+        },
+      }
     },
-  };
-  
+  ],
+}

components.d.ts

@@ -7,6 +7,10 @@ export {}
 /* prettier-ignore */
 declare module 'vue' {
   export interface GlobalComponents {
+    AuthDashboard: typeof import('./src/components/AuthDashboard.vue')['default']
+    AuthLogin: typeof import('./src/components/AuthLogin.vue')['default']
+    AuthLogoutBtn: typeof import('./src/components/AuthLogoutBtn.vue')['default']
+    AuthProfile: typeof import('./src/components/AuthProfile.vue')['default']
     BButton: typeof import('bootstrap-vue-next')['BButton']
     BCollapse: typeof import('bootstrap-vue-next')['BCollapse']
     BForm: typeof import('bootstrap-vue-next')['BForm']
@@ -23,8 +27,9 @@ declare module 'vue' {
     EtudiantCreate: typeof import('./src/components/EtudiantCreate.vue')['default']
     EtudiantEdit: typeof import('./src/components/EtudiantEdit.vue')['default']
     EtudiantPreview: typeof import('./src/components/EtudiantPreview.vue')['default']
+    EtudintRemove: typeof import('./src/components/EtudintRemove.vue')['default']
     Footer: typeof import('./src/components/Footer.vue')['default']
-    Gallery: typeof import('./src/components/Gallery.vue')['default']
+    Form: typeof import('./src/components/Form.vue')['default']
     Header: typeof import('./src/components/Header.vue')['default']
     Home: typeof import('./src/components/Home.vue')['default']
     RouteHome: typeof import('./src/components/RouteHome.vue')['default']

jest.config.cjs

@@ -1,18 +1,19 @@
 module.exports = {
-    moduleFileExtensions: ["vue", "js", "ts", "tsx" ],
-    moduleNameMapper: {
-      "\\.(jpg|ico|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":
-        "<rootDir>/__mocks__/fileMock.js",
-    },
-    preset: "ts-jest",
-    testEnvironment: "jest-environment-jsdom",
-    testEnvironmentOptions: {
-      customExportConditions: ["node", "node-addons"],
-    },
-    transform: {
-      "^.+\\.(t|j)s?$": "babel-jest",
-      "^.+\\.vue$": "@vue/vue3-jest",
-    },
-    setupFilesAfterEnv: ['./tests/router-mock-setup.js'],
-  };
-
+  moduleFileExtensions: ["vue", "js", "ts", "tsx"],
+  moduleNameMapper: {
+    "\\.(jpg|ico|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":
+      "<rootDir>/__mocks__/fileMock.js",
+  },
+  preset: "ts-jest",
+  testEnvironment: "jest-environment-jsdom",
+  testEnvironmentOptions: {
+    customExportConditions: ["node", "node-addons"],
+  },
+  transform: {
+    "^.+\\.(t|j)s?$": "babel-jest",
+    "^.+\\.vue$": "@vue/vue3-jest",
+  },
+  setupFilesAfterEnv: ["./tests/router-mock-setup.js"],
+  transformIgnorePatterns: ["<rootDir>/node_modules/(?!@teamhanko)"],
+  collectCoverageFrom: ["**/*.{ts,vue}", "!**/node_modules/**"],
+};