Metrik/vc-stats
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages 1 Wiki Activity Actions

🔨 refactor: Switch formatter to prettier
All checks were successful
/ build-bot (push) Successful in 23s
Details

Browse source
This commit is contained in:
Marsn3 2025-03-28 06:07:54 +01:00
parent f250f86fac
commit 71b029b073
10 changed files with 169 additions and 118 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
src/frontend/eslint.config.ts
View file

@ -1,7 +1,7 @@
import pluginVue from 'eslint-plugin-vue' import pluginVue from "eslint-plugin-vue";
import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript' import { defineConfigWithVueTs, vueTsConfigs } from "@vue/eslint-config-typescript";
import oxlint from 'eslint-plugin-oxlint' import oxlint from "eslint-plugin-oxlint";
import skipFormatting from '@vue/eslint-config-prettier/skip-formatting' import skipFormatting from "@vue/eslint-config-prettier/skip-formatting";
// To allow more languages other than `ts` in `.vue` files, uncomment the following lines: // To allow more languages other than `ts` in `.vue` files, uncomment the following lines:
// import { configureVueProject } from '@vue/eslint-config-typescript' // import { configureVueProject } from '@vue/eslint-config-typescript'
@ -10,17 +10,17 @@ import skipFormatting from '@vue/eslint-config-prettier/skip-formatting'
export default defineConfigWithVueTs( export default defineConfigWithVueTs(
{ {
name: 'app/files-to-lint', name: "app/files-to-lint",
files: ['**/*.{ts,mts,tsx,vue}'], files: ["**/*.{ts,mts,tsx,vue}"],
}, },
{ {
name: 'app/files-to-ignore', name: "app/files-to-ignore",
ignores: ['**/dist/**', '**/dist-ssr/**', '**/coverage/**'], ignores: ["**/dist/**", "**/dist-ssr/**", "**/coverage/**"],
}, },
pluginVue.configs['flat/essential'], pluginVue.configs["flat/essential"],
vueTsConfigs.recommended, vueTsConfigs.recommended,
oxlint.configs['flat/recommended'], oxlint.configs["flat/recommended"],
skipFormatting, skipFormatting,
) );

8
src/frontend/index.html
View file

@ -1,9 +1,9 @@
<!DOCTYPE html> <!doctype html>
<html lang=""> <html lang="">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico"> <link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite App</title> <title>Vite App</title>
</head> </head>
<body> <body>

10
src/frontend/package.json
View file

@ -20,6 +20,11 @@
"tailwindcss": "^4.0.9", "tailwindcss": "^4.0.9",
"vue": "^3.5.13" "vue": "^3.5.13"
}, },
"prettier": {
"plugins": [
"tailwindcss"
]
},
"devDependencies": { "devDependencies": {
"@tsconfig/node22": "^22.0.0", "@tsconfig/node22": "^22.0.0",
"@types/node": "^22.10.7", "@types/node": "^22.10.7",
@ -28,13 +33,14 @@
"@vue/eslint-config-typescript": "^14.3.0", "@vue/eslint-config-typescript": "^14.3.0",
"@vue/tsconfig": "^0.7.0", "@vue/tsconfig": "^0.7.0",
"daisyui": "^5.0.6", "daisyui": "^5.0.6",
"eslint": "^9.18.0", "eslint": "^9.20.1",
"eslint-plugin-oxlint": "^0.15.6", "eslint-plugin-oxlint": "^0.15.6",
"eslint-plugin-vue": "^9.32.0", "eslint-plugin-vue": "^9.32.0",
"jiti": "^2.4.2", "jiti": "^2.4.2",
"npm-run-all2": "^7.0.2", "npm-run-all2": "^7.0.2",
"oxlint": "^0.15.6", "oxlint": "^0.15.6",
"prettier": "^3.4.2", "prettier": "^3.5.0",
"prettier-plugin-tailwindcss": "^0.6.11",
"typescript": "~5.7.3", "typescript": "~5.7.3",
"vite": "^6.0.11", "vite": "^6.0.11",
"vite-plugin-vue-devtools": "^7.7.0", "vite-plugin-vue-devtools": "^7.7.0",

66
src/frontend/pnpm-lock.yaml generated
View file

@ -43,7 +43,7 @@ importers:
specifier: ^5.0.6 specifier: ^5.0.6
version: 5.0.6 version: 5.0.6
eslint: eslint:
specifier: ^9.18.0 specifier: ^9.20.1
version: 9.20.1(jiti@2.4.2) version: 9.20.1(jiti@2.4.2)
eslint-plugin-oxlint: eslint-plugin-oxlint:
specifier: ^0.15.6 specifier: ^0.15.6
@ -61,8 +61,11 @@ importers:
specifier: ^0.15.6 specifier: ^0.15.6
version: 0.15.10 version: 0.15.10
prettier: prettier:
specifier: ^3.4.2 specifier: ^3.5.0
version: 3.5.0 version: 3.5.0
prettier-plugin-tailwindcss:
specifier: ^0.6.11
version: 0.6.11(prettier@3.5.0)
typescript: typescript:
specifier: ~5.7.3 specifier: ~5.7.3
version: 5.7.3 version: 5.7.3
@ -1555,6 +1558,61 @@ packages:
resolution: {integrity: sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==} resolution: {integrity: sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==}
engines: {node: '>=6.0.0'} engines: {node: '>=6.0.0'}
prettier-plugin-tailwindcss@0.6.11:
resolution: {integrity: sha512-YxaYSIvZPAqhrrEpRtonnrXdghZg1irNg4qrjboCXrpybLWVs55cW2N3juhspVJiO0JBvYJT8SYsJpc8OQSnsA==}
engines: {node: '>=14.21.3'}
peerDependencies:
'@ianvs/prettier-plugin-sort-imports': '*'
'@prettier/plugin-pug': '*'
'@shopify/prettier-plugin-liquid': '*'
'@trivago/prettier-plugin-sort-imports': '*'
'@zackad/prettier-plugin-twig': '*'
prettier: ^3.0
prettier-plugin-astro: '*'
prettier-plugin-css-order: '*'
prettier-plugin-import-sort: '*'
prettier-plugin-jsdoc: '*'
prettier-plugin-marko: '*'
prettier-plugin-multiline-arrays: '*'
prettier-plugin-organize-attributes: '*'
prettier-plugin-organize-imports: '*'
prettier-plugin-sort-imports: '*'
prettier-plugin-style-order: '*'
prettier-plugin-svelte: '*'
peerDependenciesMeta:
'@ianvs/prettier-plugin-sort-imports':
optional: true
'@prettier/plugin-pug':
optional: true
'@shopify/prettier-plugin-liquid':
optional: true
'@trivago/prettier-plugin-sort-imports':
optional: true
'@zackad/prettier-plugin-twig':
optional: true
prettier-plugin-astro:
optional: true
prettier-plugin-css-order:
optional: true
prettier-plugin-import-sort:
optional: true
prettier-plugin-jsdoc:
optional: true
prettier-plugin-marko:
optional: true
prettier-plugin-multiline-arrays:
optional: true
prettier-plugin-organize-attributes:
optional: true
prettier-plugin-organize-imports:
optional: true
prettier-plugin-sort-imports:
optional: true
prettier-plugin-style-order:
optional: true
prettier-plugin-svelte:
optional: true
prettier@3.5.0: prettier@3.5.0:
resolution: {integrity: sha512-quyMrVt6svPS7CjQ9gKb3GLEX/rl3BCL2oa/QkNcXv4YNVBC9olt3s+H7ukto06q7B1Qz46PbrKLO34PR6vXcA==} resolution: {integrity: sha512-quyMrVt6svPS7CjQ9gKb3GLEX/rl3BCL2oa/QkNcXv4YNVBC9olt3s+H7ukto06q7B1Qz46PbrKLO34PR6vXcA==}
engines: {node: '>=14'} engines: {node: '>=14'}
@ -3265,6 +3323,10 @@ snapshots:
dependencies: dependencies:
fast-diff: 1.3.0 fast-diff: 1.3.0
prettier-plugin-tailwindcss@0.6.11(prettier@3.5.0):
dependencies:
prettier: 3.5.0
prettier@3.5.0: {} prettier@3.5.0: {}
pretty-ms@9.2.0: pretty-ms@9.2.0:

44
src/frontend/src/App.vue
View file

@ -1,23 +1,21 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, watchEffect, watch } from 'vue'; import { ref, watchEffect, watch } from "vue";
import PocketBase from "pocketbase"; import PocketBase from "pocketbase";
import { guilds, type TypedPocketBase } from './types/global.ts'; import { guilds, type TypedPocketBase } from "./types/global.ts";
import "./assets/main.css" import "./assets/main.css";
import Stats from './components/stats.vue'; import Stats from "./components/stats.vue";
function calculateUserTimes(response, selectedEvent) { function calculateUserTimes(response, selectedEvent) {
const userEvents = {}; const userEvents = {};
const userTimes = {}; // Changed to object to store total time per user const userTimes = {}; // Changed to object to store total time per user
// 1. Group events by user ID // 1. Group events by user ID
response.forEach(item => { response.forEach((item) => {
const userId = item.member.id; const userId = item.member.id;
if (!userEvents[userId]) { if (!userEvents[userId]) {
userEvents[userId] = []; userEvents[userId] = [];
} }
userEvents[userId].push(item); userEvents[userId].push(item);
} });
);
// 2. Calculate time differences for each user // 2. Calculate time differences for each user
for (const userId in userEvents) { for (const userId in userEvents) {
@ -32,7 +30,11 @@ function calculateUserTimes(response, selectedEvent) {
// Find the next 'leave' event for the same user and channel // Find the next 'leave' event for the same user and channel
for (let j = i + 1; j < events.length; j++) { for (let j = i + 1; j < events.length; j++) {
// if same event or leave event // if same event or leave event
if (events[j].event === selectedEvent[1] && events[j].channel.id === events[i].channel.id || events[j].event === "leave" && events[j].channel.id === events[i].channel.id) { if (
(events[j].event === selectedEvent[1] &&
events[j].channel.id === events[i].channel.id) ||
(events[j].event === "leave" && events[j].channel.id === events[i].channel.id)
) {
// if (events[j].event === selectedEvent[1] && events[j].channel.id === events[i].channel.id) { // if (events[j].event === selectedEvent[1] && events[j].channel.id === events[i].channel.id) {
const joinTime = new Date(events[i].created).getTime(); const joinTime = new Date(events[i].created).getTime();
const leaveTime = new Date(events[j].created).getTime(); const leaveTime = new Date(events[j].created).getTime();
@ -50,7 +52,7 @@ function calculateUserTimes(response, selectedEvent) {
userTimes[userId] = { userTimes[userId] = {
userId: userId, userId: userId,
userName: events[0].member.name, // Assuming all events have the same username userName: events[0].member.name, // Assuming all events have the same username
totalTimeMs: totalTimeMs totalTimeMs: totalTimeMs,
}; };
} }
const userTimesArray = Object.values(userTimes); const userTimesArray = Object.values(userTimes);
@ -59,25 +61,21 @@ function calculateUserTimes(response, selectedEvent) {
return userTimesArray; return userTimesArray;
} }
const pb = new PocketBase("https://api.m3.fyi") as TypedPocketBase; const pb = new PocketBase("https://api.m3.fyi") as TypedPocketBase;
const events = ref([]) const events = ref([]);
const userTimes = ref([]) const userTimes = ref([]);
const selectedEvent = ref([]) const selectedEvent = ref([]);
const guild = ref("756605475960914200") const guild = ref("756605475960914200");
watch(selectedEvent, async () => { watch(selectedEvent, async () => {
events.value = await pb.collection("vc_stats").getFullList({ events.value = await pb.collection("vc_stats").getFullList({
filter: pb.filter(`guild.id ~ ${guild.value}`) filter: pb.filter(`guild.id ~ ${guild.value}`),
}) });
let processedData = calculateUserTimes(events!.value, selectedEvent.value); let processedData = calculateUserTimes(events!.value, selectedEvent.value);
userTimes.value = processedData; userTimes.value = processedData;
}) });
</script> </script>
<template> <template>
<main> <main>
<select class="select" v-model="selectedEvent"> <select class="select" v-model="selectedEvent">
<option :value="['deafen', 'undeafen']">Deafen</option> <option :value="['deafen', 'undeafen']">Deafen</option>
@ -89,9 +87,7 @@ watch(selectedEvent, async () => {
<!-- </div> --> <!-- </div> -->
<div v-for="timeData in userTimes" :key="timeData.userid"> <div v-for="timeData in userTimes" :key="timeData.userid">
<p> <p>User: {{ timeData.userName }} ({{ timeData.userId }})</p>
User: {{ timeData.userName }} ({{ timeData.userId }})
</p>
<p>Time in Channel: {{ timeData.totalTimeMs / 1000 / 60 / 60 }} hours</p> <p>Time in Channel: {{ timeData.totalTimeMs / 1000 / 60 / 60 }} hours</p>
</div> </div>
</main> </main>

4
src/frontend/src/components/stats.vue
View file

@ -1,9 +1,9 @@
<script setup lang="ts"> <script setup lang="ts">
const props = defineProps({ event: Object }) const props = defineProps({ event: Object });
</script> </script>
<template> <template>
<div class="flex flex-row p-5"> <div class="flex flex-row p-5">
<img class="w-10" :src=event!.member.avatar> <img class="w-10" :src="event!.member.avatar" />
<p class="mr-3"> <p class="mr-3">
{{ event!.member.name }} {{ event!.member.name }}
</p> </p>

8
src/frontend/src/main.ts
View file

@ -1,6 +1,6 @@
import './assets/main.css' import "./assets/main.css";
import { createApp } from 'vue' import { createApp } from "vue";
import App from './App.vue' import App from "./App.vue";
createApp(App).mount('#app') createApp(App).mount("#app");

84
src/frontend/src/types/global.ts
View file

@ -2,32 +2,32 @@
* This file was @generated using pocketbase-typegen * This file was @generated using pocketbase-typegen
*/ */
import type PocketBase from 'pocketbase' import type PocketBase from "pocketbase";
import type { RecordService } from 'pocketbase' import type { RecordService } from "pocketbase";
export enum Collections { export enum Collections {
VcStats = "vc_stats", VcStats = "vc_stats",
} }
// Alias types for improved usability // Alias types for improved usability
export type IsoDateString = string export type IsoDateString = string;
export type RecordIdString = string export type RecordIdString = string;
export type HTMLString = string export type HTMLString = string;
// System fields // System fields
export type BaseSystemFields<T = never> = { export type BaseSystemFields<T = never> = {
id: RecordIdString id: RecordIdString;
collectionId: string collectionId: string;
collectionName: Collections collectionName: Collections;
expand?: T expand?: T;
} };
export type AuthSystemFields<T = never> = { export type AuthSystemFields<T = never> = {
email: string email: string;
emailVisibility: boolean emailVisibility: boolean;
username: string username: string;
verified: boolean verified: boolean;
} & BaseSystemFields<T> } & BaseSystemFields<T>;
// Record types for each collection // Record types for each collection
@ -42,49 +42,49 @@ export enum VcStatsEventOptions {
} }
export enum guilds { export enum guilds {
"kaffeeklatsch" = "756605475960914200", "kaffeeklatsch" = "756605475960914200",
"acns" = "1045094089198145500" "acns" = "1045094089198145500",
} }
export type channel = { export type channel = {
id: string id: string;
name: string name: string;
} };
export type guild = { export type guild = {
icon: string icon: string;
id: string id: string;
name: guilds name: guilds;
} };
export type member = { export type member = {
avatar: string avatar: string;
id: string id: string;
name: string name: string;
} };
export type VcStatsRecord = { export type VcStatsRecord = {
channel?: channel channel?: channel;
created?: IsoDateString created?: IsoDateString;
event: VcStatsEventOptions event: VcStatsEventOptions;
guild?: guild guild?: guild;
id: string id: string;
member?: member member?: member;
updated?: IsoDateString updated?: IsoDateString;
} };
// Response types include system fields and match responses from the PocketBase API // Response types include system fields and match responses from the PocketBase API
export type VcStatsResponse = Required<VcStatsRecord> & BaseSystemFields<Texpand> export type VcStatsResponse = Required<VcStatsRecord> & BaseSystemFields<Texpand>;
// Types containing all Records and Responses, useful for creating typing helper functions // Types containing all Records and Responses, useful for creating typing helper functions
export type CollectionRecords = { export type CollectionRecords = {
vc_stats: VcStatsRecord vc_stats: VcStatsRecord;
} };
export type CollectionResponses = { export type CollectionResponses = {
vc_stats: VcStatsResponse vc_stats: VcStatsResponse;
} };
// Type for usage with type asserted PocketBase instance // Type for usage with type asserted PocketBase instance
// https://github.com/pocketbase/js-sdk#specify-typescript-definitions // https://github.com/pocketbase/js-sdk#specify-typescript-definitions
export type TypedPocketBase = PocketBase & { export type TypedPocketBase = PocketBase & {
collection(idOrName: 'vc_stats'): RecordService<VcStatsResponse> collection(idOrName: "vc_stats"): RecordService<VcStatsResponse>;
} };
export {}; export {};

15
src/frontend/tsconfig.app.json
View file

@ -1,20 +1,11 @@
{ {
"extends": "@vue/tsconfig/tsconfig.dom.json", "extends": "@vue/tsconfig/tsconfig.dom.json",
"include": [ "include": ["env.d.ts", "src/**/*", "src/**/*.d.ts", "src/**/*.vue"],
"env.d.ts", "exclude": ["src/**/__tests__/*"],
"src/**/*",
"src/**/*.d.ts",
"src/**/*.vue"
],
"exclude": [
"src/**/__tests__/*"
],
"compilerOptions": { "compilerOptions": {
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo", "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
"paths": { "paths": {
"@/*": [ "@/*": ["./src/*"]
"./src/*"
]
} }
} }
} }

20
src/frontend/vite.config.ts
View file

@ -1,20 +1,16 @@
import { fileURLToPath, URL } from 'node:url' import { fileURLToPath, URL } from "node:url";
import { defineConfig } from 'vite' import { defineConfig } from "vite";
import tailwindcss from '@tailwindcss/vite' import tailwindcss from "@tailwindcss/vite";
import vue from '@vitejs/plugin-vue' import vue from "@vitejs/plugin-vue";
import vueDevTools from 'vite-plugin-vue-devtools' import vueDevTools from "vite-plugin-vue-devtools";
// https://vite.dev/config/ // https://vite.dev/config/
export default defineConfig({ export default defineConfig({
plugins: [ plugins: [tailwindcss(), vue(), vueDevTools()],
tailwindcss(),
vue(),
vueDevTools(),
],
resolve: { resolve: {
alias: { alias: {
'@': fileURLToPath(new URL('./src', import.meta.url)) "@": fileURLToPath(new URL("./src", import.meta.url)),
}, },
}, },
}) });