diff --git a/.eslintcache b/.eslintcache
deleted file mode 100644
index d40f987..0000000
--- a/.eslintcache
+++ /dev/null
@@ -1 +0,0 @@
-[{"/root/github/claptrap-ui/.eslintrc.cjs":"1","/root/github/claptrap-ui/env.d.ts":"2","/root/github/claptrap-ui/src/components/HeaderComponent.vue":"3","/root/github/claptrap-ui/src/main.ts":"4","/root/github/claptrap-ui/src/plugins/webfontloader.ts":"5","/root/github/claptrap-ui/src/router/index.ts":"6","/root/github/claptrap-ui/src/shims-vuetify.d.ts":"7","/root/github/claptrap-ui/src/stores/coockiesStorage.ts":"8","/root/github/claptrap-ui/src/stores/user.ts":"9","/root/github/claptrap-ui/src/views/HomeView.vue":"10","/root/github/claptrap-ui/src/views/oauth/OauthCallbackView.vue":"11","/root/github/claptrap-ui/src/views/oauth/OauthRedirectView.vue":"12","/root/github/claptrap-ui/vite.config.ts":"13"},{"size":334,"mtime":1653426082929,"results":"14","hashOfConfig":"15"},{"size":281,"mtime":1653426082929,"results":"16","hashOfConfig":"15"},{"size":1671,"mtime":1653426082929,"results":"17","hashOfConfig":"15"},{"size":441,"mtime":1653426082929,"results":"18","hashOfConfig":"15"},{"size":370,"mtime":1653426082929,"results":"19","hashOfConfig":"15"},{"size":1191,"mtime":1653426082929,"results":"20","hashOfConfig":"15"},{"size":108,"mtime":1653426082929,"results":"21","hashOfConfig":"15"},{"size":386,"mtime":1653426082929,"results":"22","hashOfConfig":"15"},{"size":1795,"mtime":1653426152150,"results":"23","hashOfConfig":"15"},{"size":421,"mtime":1653426082929,"results":"24","hashOfConfig":"15"},{"size":668,"mtime":1653426082929,"results":"25","hashOfConfig":"15"},{"size":436,"mtime":1653426082929,"results":"26","hashOfConfig":"15"},{"size":713,"mtime":1653426220387,"results":"27","hashOfConfig":"15"},{"filePath":"28","messages":"29","suppressedMessages":"30","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"ekl415",{"filePath":"31","messages":"32","suppressedMessages":"33","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"34","messages":"35","suppressedMessages":"36","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"37","messages":"38","suppressedMessages":"39","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"40","messages":"41","suppressedMessages":"42","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"43","messages":"44","suppressedMessages":"45","errorCount":0,"fatalErrorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"46","messages":"47","suppressedMessages":"48","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"49","messages":"50","suppressedMessages":"51","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"52","messages":"53","suppressedMessages":"54","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"55","messages":"56","suppressedMessages":"57","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"58","messages":"59","suppressedMessages":"60","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"61","messages":"62","suppressedMessages":"63","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"64","messages":"65","suppressedMessages":"66","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/root/github/claptrap-ui/.eslintrc.cjs",[],[],"/root/github/claptrap-ui/env.d.ts",[],[],"/root/github/claptrap-ui/src/components/HeaderComponent.vue",[],[],"/root/github/claptrap-ui/src/main.ts",[],[],"/root/github/claptrap-ui/src/plugins/webfontloader.ts",[],[],"/root/github/claptrap-ui/src/router/index.ts",["67","68"],[],"/root/github/claptrap-ui/src/shims-vuetify.d.ts",[],[],"/root/github/claptrap-ui/src/stores/coockiesStorage.ts",["69"],[],"/root/github/claptrap-ui/src/stores/user.ts",["70"],[],"/root/github/claptrap-ui/src/views/HomeView.vue",[],[],"/root/github/claptrap-ui/src/views/oauth/OauthCallbackView.vue",[],[],"/root/github/claptrap-ui/src/views/oauth/OauthRedirectView.vue",["71"],[],"/root/github/claptrap-ui/vite.config.ts",[],[],{"ruleId":"72","severity":1,"message":"73","line":43,"column":24,"nodeType":"74","messageId":"75","endLine":43,"endColumn":28},{"ruleId":"76","severity":1,"message":"77","line":46,"column":7,"nodeType":"78","messageId":"79","endLine":46,"endColumn":10,"suggestions":"80"},{"ruleId":"72","severity":1,"message":"81","line":8,"column":7,"nodeType":"74","messageId":"75","endLine":8,"endColumn":12},{"ruleId":"72","severity":1,"message":"82","line":30,"column":13,"nodeType":"74","messageId":"75","endLine":30,"endColumn":18},{"ruleId":"72","severity":1,"message":"83","line":15,"column":7,"nodeType":"74","messageId":"75","endLine":15,"endColumn":11},"@typescript-eslint/no-unused-vars","'from' is defined but never used.","Identifier","unusedVar","@typescript-eslint/no-explicit-any","Unexpected any. Specify a different type.","TSAnyKeyword","unexpectedAny",["84","85"],"'index' is defined but never used.","'token' is assigned a value but never used.","'test' is assigned a value but never used.",{"messageId":"86","fix":"87","desc":"88"},{"messageId":"89","fix":"90","desc":"91"},"suggestUnknown",{"range":"92","text":"93"},"Use `unknown` instead, this will force you to explicitly, and safely assert the type is correct.","suggestNever",{"range":"92","text":"94"},"Use `never` instead, this is useful when instantiating generic type parameters that you don't need to know the type of.",[1077,1080],"unknown","never"]
\ No newline at end of file
diff --git a/.gitignore b/.gitignore
index 4cf79e6..7c417fc 100644
--- a/.gitignore
+++ b/.gitignore
@@ -20,6 +20,7 @@ coverage
# Editor directories and files
.vscode/*
!.vscode/extensions.json
+!.vscode/settings.json
.idea
*.suo
*.ntvs*
@@ -27,4 +28,6 @@ coverage
*.sln
*.sw?
.yarn/cache
-.yarn/install-state.gz
\ No newline at end of file
+.yarn/install-state.gz
+
+.eslintcache
\ No newline at end of file
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
index a3ffb49..fa40b2f 100644
--- a/.vscode/extensions.json
+++ b/.vscode/extensions.json
@@ -1,7 +1,6 @@
{
"recommendations": [
- "johnsoncodehk.volar",
- "johnsoncodehk.vscode-typescript-vue-plugin",
+ "vue.volar",
"arcanis.vscode-zipfs",
"dbaeumer.vscode-eslint",
"esbenp.prettier-vscode"
diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..0a2328e
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,17 @@
+{
+ "search.exclude": {
+ "**/.yarn": true,
+ "**/.pnp.*": true,
+ "**/node_modules": true,
+ },
+ "typescript.inlayHints.enumMemberValues.enabled": true,
+ "typescript.inlayHints.propertyDeclarationTypes.enabled": true,
+ "typescript.inlayHints.parameterNames.suppressWhenArgumentMatchesName": true,
+ "typescript.inlayHints.parameterNames.enabled": "literals",
+ "typescript.inlayHints.parameterTypes.enabled": true,
+ "javascript.inlayHints.enumMemberValues.enabled": true,
+ "javascript.inlayHints.propertyDeclarationTypes.enabled": true,
+ "javascript.inlayHints.parameterNames.suppressWhenArgumentMatchesName": true,
+ "javascript.inlayHints.parameterNames.enabled": "literals",
+
+}
diff --git a/package.json b/package.json
index e117186..138c029 100644
--- a/package.json
+++ b/package.json
@@ -17,6 +17,7 @@
"dependencies": {
"@mdi/font": "5.9.55",
"@types/js-cookie": "^3.0.2",
+ "@types/uuid": "^8.3.4",
"@vue/cli": "^5.0.4",
"axios": "^0.27.2",
"jose": "^4.8.1",
@@ -24,6 +25,7 @@
"pinia": "^2.0.13",
"pinia-plugin-persistedstate": "^1.6.0",
"roboto-fontface": "*",
+ "uuid": "^8.3.2",
"vue": "^3.2.33",
"vue-router": "^4.0.14",
"vuetify": "^3.0.0-beta.2",
diff --git a/src/App.vue b/src/App.vue
index bc6e643..6aeb616 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -3,7 +3,11 @@
-
+
+
+
+
+
diff --git a/src/components/HeaderComponent.vue b/src/components/HeaderComponent.vue
index aad38ea..328430e 100644
--- a/src/components/HeaderComponent.vue
+++ b/src/components/HeaderComponent.vue
@@ -3,9 +3,6 @@
Claptrap Bot
-
- mdi-exit-to-app
-
@@ -16,39 +13,57 @@
>
-
+
-
-
-
+
+
+
+
+ Loading...
+
-
-
+
+ {{ data.text }}
+
+
+
+
diff --git a/src/services/authService.ts b/src/services/authService.ts
index 52e767e..1fc62ee 100644
--- a/src/services/authService.ts
+++ b/src/services/authService.ts
@@ -1,5 +1,7 @@
+import { useEventQueuStore } from "@/stores/eventQueu";
import { useUserStore } from "@/stores/user";
import axios from "axios";
+import { useRouter } from "vue-router";
async function login(code: string): Promise {
const userStore = useUserStore();
@@ -21,16 +23,45 @@ async function login(code: string): Promise {
userStore.loginFail = false;
console.log("Loggin success !");
+ const eventQueuStore = useEventQueuStore();
+ eventQueuStore.push({
+ uuid: undefined,
+ type: "success",
+ text: "You are now logged in",
+ });
+
return true;
} catch (reason) {
console.log("Loggin fail !");
console.log(reason);
- userStore.token = "";
- userStore.userName = "";
- userStore.discordId = "";
- userStore.loginFail = true;
+ logout(false, true);
+
+ const eventQueuStore = useEventQueuStore();
+ eventQueuStore.push({
+ uuid: undefined,
+ type: "error",
+ text: "Login fail, Please try aguain.",
+ });
return false;
}
}
-export { login };
+function logout(expired: boolean, loginFail: boolean): void {
+ const userStore = useUserStore();
+ const router = useRouter();
+
+ userStore.token = "";
+ userStore.userName = "";
+ userStore.discordId = "";
+ userStore.loginFail = loginFail;
+ userStore.asExpired = expired;
+
+ const eventQueuStore = useEventQueuStore();
+ eventQueuStore.push({
+ uuid: undefined,
+ type: "success",
+ text: "Disconnected",
+ });
+}
+
+export { login, logout };
diff --git a/src/stores/eventQueu.ts b/src/stores/eventQueu.ts
new file mode 100644
index 0000000..3090bd4
--- /dev/null
+++ b/src/stores/eventQueu.ts
@@ -0,0 +1,31 @@
+import { defineStore } from "pinia";
+import { v4 as uuidv4 } from "uuid";
+
+interface Event {
+ uuid: string | undefined;
+ type: string;
+ text: string;
+}
+
+export const useEventQueuStore = defineStore({
+ id: "eventQueu",
+ state: () => ({
+ events: [] as Array,
+ }),
+ getters: {
+ size: (state) => {
+ return state.events.length;
+ },
+ },
+ actions: {
+ shift(): Event | undefined {
+ return this.events.shift();
+ },
+ push(event: Event) {
+ if (!event.uuid) {
+ event.uuid = uuidv4();
+ }
+ this.events.push(event);
+ },
+ },
+});
diff --git a/src/stores/user.ts b/src/stores/user.ts
index aae5023..955ea13 100644
--- a/src/stores/user.ts
+++ b/src/stores/user.ts
@@ -1,6 +1,5 @@
import { defineStore } from "pinia";
import * as jose from "jose";
-import axios from "axios";
import { cookiesStorage } from "./coockiesStorage";
export const useUserStore = defineStore("user", {
@@ -11,6 +10,7 @@ export const useUserStore = defineStore("user", {
avatar: "",
token: "",
loginFail: false,
+ asExpired: false,
}),
getters: {
isLoggedIn(): boolean {
@@ -22,12 +22,13 @@ export const useUserStore = defineStore("user", {
isExpired(): boolean {
if (this.getTokenPayload?.exp) {
const exp = new Date(this.getTokenPayload.exp * 1000);
- return exp < new Date();
+ const expired = exp < new Date();
+ this.asExpired = expired;
+ return expired;
}
return true;
},
getTokenPayload: (state) => {
- const token = state.token;
return jose.decodeJwt(state.token);
},
},
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 8dc5acc..6ecb962 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -1,17 +1,18 @@
-
+
-
- Login fail, please try again.
-
+
+ Login
+
diff --git a/yarn.lock b/yarn.lock
index 989ac1c..46bd1d0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2026,6 +2026,13 @@ __metadata:
languageName: node
linkType: hard
+"@types/uuid@npm:^8.3.4":
+ version: 8.3.4
+ resolution: "@types/uuid@npm:8.3.4"
+ checksum: 6f11f3ff70f30210edaa8071422d405e9c1d4e53abbe50fdce365150d3c698fe7bbff65c1e71ae080cbfb8fded860dbb5e174da96fdbbdfcaa3fb3daa474d20f
+ languageName: node
+ linkType: hard
+
"@types/webfontloader@npm:^1.0.0":
version: 1.6.34
resolution: "@types/webfontloader@npm:1.6.34"
@@ -3609,6 +3616,7 @@ __metadata:
"@types/js-cookie": ^3.0.2
"@types/jsdom": ^16.2.14
"@types/node": ^16.11.27
+ "@types/uuid": ^8.3.4
"@types/webfontloader": ^1.0.0
"@vitejs/plugin-vue": ^2.3.1
"@vue/cli": ^5.0.4
@@ -3633,6 +3641,7 @@ __metadata:
sass: ^1.38.0
sass-loader: ^10.0.0
typescript: ~4.6.3
+ uuid: ^8.3.2
vite: ^2.9.5
vitest: ^0.9.3
vue: ^3.2.33