From 5012517e9b5049338c92b768f1bf90095f7fc4e7 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Sun, 1 Jun 2025 05:04:38 +0200 Subject: [PATCH 001/170] feat: Fundementals for settings pages --- .../settings/app_settings/Appearance.vue | 15 ++ components/settings/user_settings/Account.vue | 13 ++ pages/settings.vue | 145 ++++++++++++++++++ 3 files changed, 173 insertions(+) create mode 100644 components/settings/app_settings/Appearance.vue create mode 100644 components/settings/user_settings/Account.vue create mode 100644 pages/settings.vue diff --git a/components/settings/app_settings/Appearance.vue b/components/settings/app_settings/Appearance.vue new file mode 100644 index 0000000..e198d64 --- /dev/null +++ b/components/settings/app_settings/Appearance.vue @@ -0,0 +1,15 @@ + + + + + \ No newline at end of file diff --git a/components/settings/user_settings/Account.vue b/components/settings/user_settings/Account.vue new file mode 100644 index 0000000..8425cd8 --- /dev/null +++ b/components/settings/user_settings/Account.vue @@ -0,0 +1,13 @@ + + + + + \ No newline at end of file diff --git a/pages/settings.vue b/pages/settings.vue new file mode 100644 index 0000000..8327370 --- /dev/null +++ b/pages/settings.vue @@ -0,0 +1,145 @@ + + + + + + + + \ No newline at end of file From 705b37fa06ab647a447295e4175f00bc1309bf66 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Sun, 1 Jun 2025 06:13:00 +0200 Subject: [PATCH 002/170] feat: button components --- components/buttons/Button.vue | 43 ++++++++++++++++++++++++++++++ components/buttons/ButtonScary.vue | 43 ++++++++++++++++++++++++++++++ 2 files changed, 86 insertions(+) create mode 100644 components/buttons/Button.vue create mode 100644 components/buttons/ButtonScary.vue diff --git a/components/buttons/Button.vue b/components/buttons/Button.vue new file mode 100644 index 0000000..20783c0 --- /dev/null +++ b/components/buttons/Button.vue @@ -0,0 +1,43 @@ + + + + + + + \ No newline at end of file diff --git a/components/buttons/ButtonScary.vue b/components/buttons/ButtonScary.vue new file mode 100644 index 0000000..71c0bc7 --- /dev/null +++ b/components/buttons/ButtonScary.vue @@ -0,0 +1,43 @@ + + + + + + + \ No newline at end of file From 39fb0a9eab26ed8d1035ed3604b5c4cbfe775605 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Sun, 1 Jun 2025 07:15:20 +0200 Subject: [PATCH 003/170] feat: start of "My Account" page, need API help --- .../settings/app_settings/Appearance.vue | 1 - components/settings/app_settings/Keybinds.vue | 12 +++ components/settings/app_settings/Language.vue | 12 +++ .../settings/app_settings/Notifications.vue | 12 +++ components/settings/user_settings/Account.vue | 28 ++++- .../settings/user_settings/Connections.vue | 12 +++ components/settings/user_settings/Devices.vue | 12 +++ components/settings/user_settings/Privacy.vue | 13 +++ pages/settings.vue | 101 ++++++++++-------- 9 files changed, 156 insertions(+), 47 deletions(-) create mode 100644 components/settings/app_settings/Keybinds.vue create mode 100644 components/settings/app_settings/Language.vue create mode 100644 components/settings/app_settings/Notifications.vue create mode 100644 components/settings/user_settings/Connections.vue create mode 100644 components/settings/user_settings/Devices.vue create mode 100644 components/settings/user_settings/Privacy.vue diff --git a/components/settings/app_settings/Appearance.vue b/components/settings/app_settings/Appearance.vue index e198d64..135c0a1 100644 --- a/components/settings/app_settings/Appearance.vue +++ b/components/settings/app_settings/Appearance.vue @@ -7,7 +7,6 @@ \ No newline at end of file diff --git a/components/settings/app_settings/Language.vue b/components/settings/app_settings/Language.vue new file mode 100644 index 0000000..b1c3a8a --- /dev/null +++ b/components/settings/app_settings/Language.vue @@ -0,0 +1,12 @@ + + + + + \ No newline at end of file diff --git a/components/settings/app_settings/Notifications.vue b/components/settings/app_settings/Notifications.vue new file mode 100644 index 0000000..2e6de9c --- /dev/null +++ b/components/settings/app_settings/Notifications.vue @@ -0,0 +1,12 @@ + + + + + \ No newline at end of file diff --git a/components/settings/user_settings/Account.vue b/components/settings/user_settings/Account.vue index 8425cd8..e137031 100644 --- a/components/settings/user_settings/Account.vue +++ b/components/settings/user_settings/Account.vue @@ -1,11 +1,35 @@ \ No newline at end of file diff --git a/components/settings/user_settings/Devices.vue b/components/settings/user_settings/Devices.vue new file mode 100644 index 0000000..7006a12 --- /dev/null +++ b/components/settings/user_settings/Devices.vue @@ -0,0 +1,12 @@ + + + + + \ No newline at end of file diff --git a/components/settings/user_settings/Privacy.vue b/components/settings/user_settings/Privacy.vue new file mode 100644 index 0000000..b805a7c --- /dev/null +++ b/components/settings/user_settings/Privacy.vue @@ -0,0 +1,13 @@ + + + + + \ No newline at end of file diff --git a/pages/settings.vue b/pages/settings.vue index 8327370..7c68e63 100644 --- a/pages/settings.vue +++ b/pages/settings.vue @@ -2,36 +2,34 @@
- +
- \ No newline at end of file diff --git a/components/settings/user_settings/Account.vue b/components/settings/user_settings/Account.vue index e137031..9b7d044 100644 --- a/components/settings/user_settings/Account.vue +++ b/components/settings/user_settings/Account.vue @@ -3,14 +3,14 @@

My Account

- +

Password (and eventually authenticator)

- +

Account Deletion

- + @@ -19,7 +19,9 @@ import Button from '~/components/buttons/Button.vue'; import ButtonScary from '~/components/buttons/ButtonScary.vue'; -const { user } = useAuth(); +const { user, fetchUser } = useAuth(); + +const user_me = await fetchUser() const resetPassword = async () => { @@ -27,11 +29,17 @@ const resetPassword = async () => { // await fetchWithApi(`/auth/reset-password`); } -const deleteAccount = () => { +const deleteAccount = async () => { alert("TBD") } \ No newline at end of file diff --git a/composables/auth.ts b/composables/auth.ts index 19ac694..0ac2e8b 100644 --- a/composables/auth.ts +++ b/composables/auth.ts @@ -75,7 +75,7 @@ export const useAuth = () => { async function fetchUser() { if (!accessToken.value) return; console.log("fetchuser access token:", accessToken.value); - const res = await fetchWithApi("/users/me") as UserResponse; + const res = await fetchWithApi("/me") as UserResponse; user.value = res; return user.value; } @@ -88,6 +88,20 @@ export const useAuth = () => { return user.value; } + + // as in email the password link + async function resetPassword() { + // ... + } + + async function disableAccount() { + // ... + } + + async function deleteAccount() { + // ... + } + return { accessToken, register, diff --git a/pages/settings.vue b/pages/settings.vue index 9e7d420..050c1f8 100644 --- a/pages/settings.vue +++ b/pages/settings.vue @@ -69,17 +69,34 @@ const settingsCategories = { { display_name: "Language", page_data: Language }, ] }, + app_settings2: { + display_name: "App Settings", + pages: [ + { display_name: "Appearance", page_data: Appearance }, + { display_name: "Notifications", page_data: Notifications }, + { display_name: "Keybinds", page_data: Keybinds }, + { display_name: "Language", page_data: Language }, + ] + }, + app_settings3: { + display_name: "App Settings", + pages: [ + { display_name: "Appearance", page_data: Appearance }, + { display_name: "Notifications", page_data: Notifications }, + { display_name: "Keybinds", page_data: Keybinds }, + { display_name: "Language", page_data: Language }, + ] + }, }; const categories = Object.values(settingsCategories); let currentPage = ref(categories[0].pages[0]); -let selectedPage = ref(currentPage.value.display_name); +let selectedPage = ref(currentPage.value.display_name); // used to highlight the current channel const selectCategory = (_category: Category, page: Page) => { currentPage.value = page; selectedPage.value = page.display_name; - console.log(`switching to ${page.display_name}`) }; diff --git a/types/interfaces.ts b/types/interfaces.ts index b4869e2..cd4b6dd 100644 --- a/types/interfaces.ts +++ b/types/interfaces.ts @@ -58,6 +58,7 @@ export interface UserResponse { username: string, display_name: string | null, avatar: string | null, + pronouns: string | null, email?: string, email_verified?: boolean } From 256889a573e62a45a84eebdbc828c949faef28db Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Sun, 1 Jun 2025 17:46:09 +0200 Subject: [PATCH 007/170] feat: favicon!! --- composables/auth.ts | 1 + public/favicon.ico | Bin 4286 -> 14463 bytes types/interfaces.ts | 2 +- 3 files changed, 2 insertions(+), 1 deletion(-) diff --git a/composables/auth.ts b/composables/auth.ts index 0ac2e8b..4ec2f32 100644 --- a/composables/auth.ts +++ b/composables/auth.ts @@ -76,6 +76,7 @@ export const useAuth = () => { if (!accessToken.value) return; console.log("fetchuser access token:", accessToken.value); const res = await fetchWithApi("/me") as UserResponse; + res.avatar = res.avatar ?? "https://gorb.b-cdn.net/avatar/default-pfp.png"; user.value = res; return user.value; } diff --git a/public/favicon.ico b/public/favicon.ico index 18993ad91cfd43e03b074dd0b5cc3f37ab38e49c..b3d28fa5964b5ad48b8b2fd2fce843074b44cee3 100644 GIT binary patch literal 14463 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 literal 4286 zcmeHLOKuuL5PjK%MHWVi6lD zOGiREbCw`xmFozJ^aNatJY>w+g ze6a2@u~m#^BZm@8wco9#Crlli0uLb^3E$t2-WIc^#(?t)*@`UpuofJ(Uyh@F>b3Ph z$D^m8Xq~pTkGJ4Q`Q2)te3mgkWYZ^Ijq|hkiP^9`De={bQQ%heZC$QU2UpP(-tbl8 zPWD2abEew;oat@w`uP3J^YpsgT%~jT(Dk%oU}sa$7|n6hBjDj`+I;RX(>)%lm_7N{+B7Mu%H?422lE%MBJH!!YTN2oT7xr>>N-8OF$C&qU^ z>vLsa{$0X%q1fjOe3P1mCv#lN{xQ4_*HCSAZjTb1`}mlc+9rl8$B3OP%VT@mch_~G z7Y+4b{r>9e=M+7vSI;BgB?ryZDY4m>&wcHSn81VH1N~`0gvwH{ z8dv#hG|OK`>1;j7tM#B)Z7zDN?{6=dUal}$e Date: Sun, 1 Jun 2025 19:24:50 +0200 Subject: [PATCH 008/170] feat: profile page, EXCEPT FUCKING AVATARS AAAAAHHH --- components/Userpopup.vue | 48 ++++---- components/buttons/Button.vue | 6 +- components/buttons/ButtonScary.vue | 6 +- components/settings/user_settings/Account.vue | 115 +++++++++++++++++- composables/auth.ts | 1 - pages/settings.vue | 9 +- types/interfaces.ts | 3 +- 7 files changed, 148 insertions(+), 40 deletions(-) diff --git a/components/Userpopup.vue b/components/Userpopup.vue index 1e90026..7381637 100644 --- a/components/Userpopup.vue +++ b/components/Userpopup.vue @@ -3,8 +3,12 @@ profile avatar
-

{{ props.user.display_name || "display_name" }}

-

{{ props.user.username || "username" }}

+

+ {{ props.user.display_name || "display_name" }} +

+

+ {{ props.user.username || "username" }} - {{ props.user.pronouns || "un/defined" }} +

About me
@@ -18,15 +22,15 @@ import type { UserResponse } from '~/types/interfaces'; const { fetchMembers } = useApi(); const props = defineProps<{ - user: UserResponse, + user: UserResponse | any, // actually UserResponse | null but TS is yelling at me again }>(); \ No newline at end of file diff --git a/components/buttons/Button.vue b/components/buttons/Button.vue index 20783c0..2544fbb 100644 --- a/components/buttons/Button.vue +++ b/components/buttons/Button.vue @@ -28,11 +28,11 @@ const props = defineProps<{ background-color: #b35719; color: #ffffff; - padding: 8px 16px; - font-size: 16px; + padding: 8px 18px; + font-size: 18px; transition: background-color 0.2s; - border-radius: 16px; + border-radius: 12px; text-decoration: none; display: inline-block; } diff --git a/components/buttons/ButtonScary.vue b/components/buttons/ButtonScary.vue index 71c0bc7..1fa2c85 100644 --- a/components/buttons/ButtonScary.vue +++ b/components/buttons/ButtonScary.vue @@ -28,11 +28,11 @@ const props = defineProps<{ background-color: #f02f2f; color: #ffffff; - padding: 8px 16px; - font-size: 16px; + padding: 8px 18px; + font-size: 18px; transition: background-color 0.2s; - border-radius: 16px; + border-radius: 12px; text-decoration: none; display: inline-block; } diff --git a/components/settings/user_settings/Account.vue b/components/settings/user_settings/Account.vue index 9b7d044..74d120d 100644 --- a/components/settings/user_settings/Account.vue +++ b/components/settings/user_settings/Account.vue @@ -2,10 +2,31 @@

My Account

-
- +
+
+

AVATAR

+ + +

DISPLAY NAME

+ +

USERNAME

+ +

PRONOUNS

+ +

ABOUT ME

+

{{ user?.about_me || "TBD" }}

+ + +
+
+ +
+
+
+
+

Password (and eventually authenticator)

@@ -19,10 +40,81 @@ import Button from '~/components/buttons/Button.vue'; import ButtonScary from '~/components/buttons/ButtonScary.vue'; -const { user, fetchUser } = useAuth(); +const { fetchUser } = useAuth(); const user_me = await fetchUser() +let user_reference = Object.assign({}, user_me) +const user = user_me! +let new_pfp_file: any = null + +const saveChanges = async () => { + try { + const formData = new FormData() + + if (new_pfp_file) { + formData.append('avatar', new_pfp_file, new_pfp_file.name) + new_pfp_file = null + } + + // oh lord praise deep seek v3 + const jsonBlob = new Blob( + [JSON.stringify({ + display_name: user.display_name, + username: user.username, + pronouns: user.pronouns, + })], + { type: 'application/json' } + ); + formData.append('json', jsonBlob, 'data.json'); + + await fetchWithApi("/me", { + method: "PATCH", + body: formData + }) + + user_reference = Object.assign({}, user_me) + alert("success!!") + } catch (error: any) { + if (error?.response?.status !== 200) { + const errorData = await error?.response?.json() + + alert(`error ${error?.response?.status} met whilst trying to update profile info\n${errorData}`) + } + } +}; + + +const removeAvatar = async () => { + alert("TBD") + // await fetchWithApi(`/auth/reset-password`); +} + +const changeAvatar = async () => { + try { + let input = document.createElement('input'); + input.type = 'file'; + input.accept = 'image/*'; + + input.onchange = async(e) => { + const file = e.target.files?.[0]; + if (!file) return; + + new_pfp_file = file; + + const reader = new FileReader(); + reader.onload = (e) => { + user.avatar = e?.target?.result; + }; + reader.readAsDataURL(file); + } + + input.oncancel = () => alert("cancelled upload!"); + input.click(); + } catch (err) { + console.error('User canceled or error:', err); + } +} const resetPassword = async () => { alert("TBD") @@ -35,11 +127,24 @@ const deleteAccount = async () => { \ No newline at end of file diff --git a/composables/auth.ts b/composables/auth.ts index 4ec2f32..0ac2e8b 100644 --- a/composables/auth.ts +++ b/composables/auth.ts @@ -76,7 +76,6 @@ export const useAuth = () => { if (!accessToken.value) return; console.log("fetchuser access token:", accessToken.value); const res = await fetchWithApi("/me") as UserResponse; - res.avatar = res.avatar ?? "https://gorb.b-cdn.net/avatar/default-pfp.png"; user.value = res; return user.value; } diff --git a/pages/settings.vue b/pages/settings.vue index 050c1f8..fb66aa2 100644 --- a/pages/settings.vue +++ b/pages/settings.vue @@ -115,8 +115,8 @@ const selectCategory = (_category: Category, page: Page) => { } #sidebar { - min-width: 200px; - max-width: 200px; + min-width: 250px; + max-width: 250px; background-color: #2f3136; color: white; padding: 10px; @@ -127,7 +127,7 @@ const selectCategory = (_category: Category, page: Page) => { } #sidebar h2 { - font-size: 1.5em; + font-size: 2em; padding: 0 8px; } @@ -140,6 +140,7 @@ const selectCategory = (_category: Category, page: Page) => { #sidebar li { border-radius: 8px; padding: 8px; + font-size: 1.3em; margin: 2px 0; cursor: pointer; transition: background-color 0.3s; @@ -155,7 +156,7 @@ const selectCategory = (_category: Category, page: Page) => { #sub_page { flex-grow: 1; - max-width: 600px; + max-width: 800px; margin-left: 1.5rem; margin-right: auto; diff --git a/types/interfaces.ts b/types/interfaces.ts index a0d7d39..04da39a 100644 --- a/types/interfaces.ts +++ b/types/interfaces.ts @@ -57,8 +57,9 @@ export interface UserResponse { uuid: string, username: string, display_name: string | null, - avatar: string, + avatar: string | null, pronouns: string | null, + about_me: string | null, email?: string, email_verified?: boolean } From 0ddddd210e2c4b5be417c3ae94a5db2e24b40879 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Sun, 1 Jun 2025 20:19:04 +0200 Subject: [PATCH 009/170] feat: fucking explode i hate this --- components/settings/user_settings/Account.vue | 54 ++++++++----------- pages/settings.vue | 4 +- 2 files changed, 25 insertions(+), 33 deletions(-) diff --git a/components/settings/user_settings/Account.vue b/components/settings/user_settings/Account.vue index 74d120d..c1fdc77 100644 --- a/components/settings/user_settings/Account.vue +++ b/components/settings/user_settings/Account.vue @@ -1,5 +1,6 @@ @@ -50,36 +53,33 @@ const user = user_me! let new_pfp_file: any = null const saveChanges = async () => { + const formData = new FormData() + + if (new_pfp_file !== null) { + formData.append("avatar", new_pfp_file) + } + + const bytes = new TextEncoder().encode(JSON.stringify({ + display_name: user.display_name, + username: user.username, + pronouns: user.pronouns, + about: user.about, + })); + formData.append('json', new Blob([bytes], { type: 'application/json' })); + try { - const formData = new FormData() - - const upload_field: HTMLInputElement = document.getElementById("hidden-pfp-uploader") - if (upload_field.files?.length && upload_field.files.length > 0) { - console.log(upload_field.files[0]) - formData.append("avatar", upload_field.files[0]) - } - - const bytes = new TextEncoder().encode(JSON.stringify({ - display_name: user.display_name, - username: user.username, - pronouns: user.pronouns, - })); - formData.append("json", new Blob([bytes], { type: "application/json" })); - - await fetchWithApi("/me", { - method: "PATCH", + await fetchWithApi('/me', { + method: 'PATCH', body: formData }) - user_reference = Object.assign({}, user_me) - alert("success!!") + user_reference = Object.assign({}, await fetchUser()) + alert('success!!') } catch (error: any) { if (error?.response?.status !== 200) { - const errorData = await error?.response?.json() - - alert(`error ${error?.response?.status} met whilst trying to update profile info\n${errorData}`) + alert(`error ${error?.response?.status} met whilst trying to update profile info`) } - } + } }; @@ -89,23 +89,28 @@ const removeAvatar = async () => { } const changeAvatar = async () => { - const upload_field: HTMLInputElement = document.getElementById("hidden-pfp-uploader") - - // upload_field.onchange = async(e) => { - // console.log(upload_field.files) - // if (upload_field.files?.length && upload_field.files.length > 0) { - // const file = upload_field.files[0]; - // if (!file) return; + let input = document.createElement('input'); + input.type = 'file'; + input.accept = 'image/*'; - // const reader = new FileReader(); - // reader.onload = (e) => { - // user.avatar = e?.target?.result; - // }; - // reader.readAsDataURL(file); - // } - // } + input.onchange = async (e) => { + if (input.files?.length && input.files.length > 0) { + const file = input.files[0]; + if (!file) return; - upload_field?.click() + new_pfp_file = file + + const reader = new FileReader(); + reader.onload = (e) => { + if (e.target?.result && typeof e.target.result === 'string') { + user.avatar = e.target.result; + } + }; + reader.readAsDataURL(file); + } + } + + input.click() } const resetPassword = async () => { @@ -130,7 +135,8 @@ const deleteAccount = async () => { display: flex; } -.profile-container, .user-data-fields { +.profile-container, +.user-data-fields { min-width: 350px; } @@ -139,4 +145,16 @@ const deleteAccount = async () => { font-weight: 800; margin: 12px 0; } + +.profile-data-input { + min-width: 300px; + margin: 2px; + padding: 2px 10px; + height: 40px; + font-size: 16px; + border-radius: 8px; + border: none; + color: white; + background-color: #54361b; +} \ No newline at end of file diff --git a/pages/settings.vue b/pages/settings.vue index 60c4265..0c2fefe 100644 --- a/pages/settings.vue +++ b/pages/settings.vue @@ -69,24 +69,6 @@ const settingsCategories = { { display_name: "Language", page_data: Language }, ] }, - app_settings2: { - display_name: "App Settings", - pages: [ - { display_name: "Appearance", page_data: Appearance }, - { display_name: "Notifications", page_data: Notifications }, - { display_name: "Keybinds", page_data: Keybinds }, - { display_name: "Language", page_data: Language }, - ] - }, - app_settings3: { - display_name: "App Settings", - pages: [ - { display_name: "Appearance", page_data: Appearance }, - { display_name: "Notifications", page_data: Notifications }, - { display_name: "Keybinds", page_data: Keybinds }, - { display_name: "Language", page_data: Language }, - ] - }, }; const categories = Object.values(settingsCategories); diff --git a/types/interfaces.ts b/types/interfaces.ts index 04da39a..b5b1995 100644 --- a/types/interfaces.ts +++ b/types/interfaces.ts @@ -59,7 +59,7 @@ export interface UserResponse { display_name: string | null, avatar: string | null, pronouns: string | null, - about_me: string | null, + about: string | null, email?: string, email_verified?: boolean } From a38589615b7fe13efd36ca302a1410c05bc32718 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Mon, 2 Jun 2025 13:14:08 +0200 Subject: [PATCH 013/170] chore: finnish merge --- components/settings/user_settings/Account.vue | 33 +++++++++---------- 1 file changed, 16 insertions(+), 17 deletions(-) diff --git a/components/settings/user_settings/Account.vue b/components/settings/user_settings/Account.vue index f8e15bc..6438946 100644 --- a/components/settings/user_settings/Account.vue +++ b/components/settings/user_settings/Account.vue @@ -53,24 +53,23 @@ const user = user_me! let new_pfp_file: any = null const saveChanges = async () => { + const formData = new FormData() + + if (new_pfp_file !== null) { + formData.append("avatar", new_pfp_file) + } + + const bytes = new TextEncoder().encode(JSON.stringify({ + display_name: user.display_name, + username: user.username, + pronouns: user.pronouns, + about: user.about, + })); + formData.append('json', new Blob([bytes], { type: 'application/json' })); + try { - const formData = new FormData() - - const upload_field = document.getElementById("hidden-pfp-uploader") - if (upload_field.files?.length && upload_field.files.length > 0) { - console.log(upload_field.files[0]) - formData.append("avatar", upload_field.files[0]) - } - - const bytes = new TextEncoder().encode(JSON.stringify({ - display_name: user.display_name, - username: user.username, - pronouns: user.pronouns, - })); - formData.append("json", new Blob([bytes], { type: "application/json" })); - - await fetchWithApi("/me", { - method: "PATCH", + await fetchWithApi('/me', { + method: 'PATCH', body: formData }) From 22b43cde79d6a7f7d74ffdeedcfffbc118015485 Mon Sep 17 00:00:00 2001 From: SauceyRed Date: Tue, 3 Jun 2025 22:04:05 +0200 Subject: [PATCH 014/170] feat: make profile settings headings into block labels for accessibility --- components/settings/user_settings/Account.vue | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/components/settings/user_settings/Account.vue b/components/settings/user_settings/Account.vue index 6438946..28f6a25 100644 --- a/components/settings/user_settings/Account.vue +++ b/components/settings/user_settings/Account.vue @@ -5,18 +5,18 @@
-

AVATAR

+

AVATAR

-

DISPLAY NAME

- -

USERNAME

- -

PRONOUNS

- -

ABOUT ME

- + + + + + + + +

@@ -141,6 +141,7 @@ const deleteAccount = async () => { } .subtitle { + display: block; font-size: 14px; font-weight: 800; margin: 12px 0; From 556068063548e1be8c2be067bbdca8b4ac9c8061 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Wed, 11 Jun 2025 17:42:35 +0200 Subject: [PATCH 015/170] feat: use dynamic units, minor refactoring --- components/{buttons => Buttons}/Button.vue | 0 .../{buttons => Buttons}/ButtonScary.vue | 0 .../AppSettings}/Appearance.vue | 0 .../AppSettings}/Keybinds.vue | 0 .../AppSettings}/Language.vue | 0 .../AppSettings}/Notifications.vue | 0 .../UserSettings}/Account.vue | 81 +++++++++---------- .../UserSettings}/Connections.vue | 0 .../UserSettings}/Devices.vue | 0 .../UserSettings}/Privacy.vue | 2 +- components/{Userpopup.vue => UserPopup.vue} | 9 ++- pages/settings.vue | 50 +++++------- 12 files changed, 66 insertions(+), 76 deletions(-) rename components/{buttons => Buttons}/Button.vue (100%) rename components/{buttons => Buttons}/ButtonScary.vue (100%) rename components/{settings/app_settings => Settings/AppSettings}/Appearance.vue (100%) rename components/{settings/app_settings => Settings/AppSettings}/Keybinds.vue (100%) rename components/{settings/app_settings => Settings/AppSettings}/Language.vue (100%) rename components/{settings/app_settings => Settings/AppSettings}/Notifications.vue (100%) rename components/{settings/user_settings => Settings/UserSettings}/Account.vue (71%) rename components/{settings/user_settings => Settings/UserSettings}/Connections.vue (100%) rename components/{settings/user_settings => Settings/UserSettings}/Devices.vue (100%) rename components/{settings/user_settings => Settings/UserSettings}/Privacy.vue (70%) rename components/{Userpopup.vue => UserPopup.vue} (81%) diff --git a/components/buttons/Button.vue b/components/Buttons/Button.vue similarity index 100% rename from components/buttons/Button.vue rename to components/Buttons/Button.vue diff --git a/components/buttons/ButtonScary.vue b/components/Buttons/ButtonScary.vue similarity index 100% rename from components/buttons/ButtonScary.vue rename to components/Buttons/ButtonScary.vue diff --git a/components/settings/app_settings/Appearance.vue b/components/Settings/AppSettings/Appearance.vue similarity index 100% rename from components/settings/app_settings/Appearance.vue rename to components/Settings/AppSettings/Appearance.vue diff --git a/components/settings/app_settings/Keybinds.vue b/components/Settings/AppSettings/Keybinds.vue similarity index 100% rename from components/settings/app_settings/Keybinds.vue rename to components/Settings/AppSettings/Keybinds.vue diff --git a/components/settings/app_settings/Language.vue b/components/Settings/AppSettings/Language.vue similarity index 100% rename from components/settings/app_settings/Language.vue rename to components/Settings/AppSettings/Language.vue diff --git a/components/settings/app_settings/Notifications.vue b/components/Settings/AppSettings/Notifications.vue similarity index 100% rename from components/settings/app_settings/Notifications.vue rename to components/Settings/AppSettings/Notifications.vue diff --git a/components/settings/user_settings/Account.vue b/components/Settings/UserSettings/Account.vue similarity index 71% rename from components/settings/user_settings/Account.vue rename to components/Settings/UserSettings/Account.vue index 28f6a25..120ceb3 100644 --- a/components/settings/user_settings/Account.vue +++ b/components/Settings/UserSettings/Account.vue @@ -1,14 +1,13 @@ \ No newline at end of file diff --git a/components/settings/user_settings/Connections.vue b/components/Settings/UserSettings/Connections.vue similarity index 100% rename from components/settings/user_settings/Connections.vue rename to components/Settings/UserSettings/Connections.vue diff --git a/components/settings/user_settings/Devices.vue b/components/Settings/UserSettings/Devices.vue similarity index 100% rename from components/settings/user_settings/Devices.vue rename to components/Settings/UserSettings/Devices.vue diff --git a/components/settings/user_settings/Privacy.vue b/components/Settings/UserSettings/Privacy.vue similarity index 70% rename from components/settings/user_settings/Privacy.vue rename to components/Settings/UserSettings/Privacy.vue index b805a7c..1e1c2a1 100644 --- a/components/settings/user_settings/Privacy.vue +++ b/components/Settings/UserSettings/Privacy.vue @@ -5,7 +5,7 @@ - - - \ No newline at end of file From 714f75ce1230e9c49ee16336859c008fef4ed7a1 Mon Sep 17 00:00:00 2001 From: Radical Date: Mon, 23 Jun 2025 19:59:52 +0200 Subject: [PATCH 016/170] feat: update button component co-authored-by: JustTemmie --- components/Button.vue | 44 ++++++++++++++ components/Buttons/Button.vue | 43 -------------- components/Buttons/ButtonScary.vue | 43 -------------- components/Settings/UserSettings/Account.vue | 13 ++--- components/Settings/UserSettings/Privacy.vue | 2 +- components/UserPopup.vue | 2 +- pages/settings.vue | 61 ++++++++++---------- 7 files changed, 82 insertions(+), 126 deletions(-) create mode 100644 components/Button.vue delete mode 100644 components/Buttons/Button.vue delete mode 100644 components/Buttons/ButtonScary.vue diff --git a/components/Button.vue b/components/Button.vue new file mode 100644 index 0000000..1374344 --- /dev/null +++ b/components/Button.vue @@ -0,0 +1,44 @@ + + + + + \ No newline at end of file diff --git a/components/Buttons/Button.vue b/components/Buttons/Button.vue deleted file mode 100644 index 2544fbb..0000000 --- a/components/Buttons/Button.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - - - - - \ No newline at end of file diff --git a/components/Buttons/ButtonScary.vue b/components/Buttons/ButtonScary.vue deleted file mode 100644 index 1fa2c85..0000000 --- a/components/Buttons/ButtonScary.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - - - - - \ No newline at end of file diff --git a/components/Settings/UserSettings/Account.vue b/components/Settings/UserSettings/Account.vue index 120ceb3..5e883f5 100644 --- a/components/Settings/UserSettings/Account.vue +++ b/components/Settings/UserSettings/Account.vue @@ -6,7 +6,7 @@

AVATAR

- + @@ -34,8 +34,7 @@ \ No newline at end of file diff --git a/components/Settings/UserSettings/Account.vue b/components/Settings/UserSettings/Account.vue index 5e883f5..0fe5013 100644 --- a/components/Settings/UserSettings/Account.vue +++ b/components/Settings/UserSettings/Account.vue @@ -2,8 +2,8 @@

My Account

-
-
+
+

AVATAR

@@ -21,14 +21,14 @@
- +
-

Password (and eventually authenticator)

+

Password (and eventually authenticator)

- +

Account Deletion

- +
@@ -39,20 +39,19 @@ import type { UserResponse } from '~/types/interfaces'; const { fetchUser } = useAuth(); -const user_me = await fetchUser() -if (user_me === undefined) { +const user: UserResponse | undefined = await fetchUser() +if (!user) { alert("could not fetch user info, aborting :(") } -let userReference = Object.assign({}, user_me) -const user: UserResponse = user_me! - -let newPfpFile: any = null +let newPfpFile: File; const saveChanges = async () => { + if (!user) return; + const formData = new FormData() - if (newPfpFile !== null) { + if (newPfpFile) { formData.append("avatar", newPfpFile) } @@ -70,7 +69,6 @@ const saveChanges = async () => { body: formData }) - userReference = Object.assign({}, await fetchUser()) alert('success!!') } catch (error: any) { if (error?.response?.status !== 200) { @@ -86,7 +84,9 @@ const removeAvatar = async () => { } const changeAvatar = async () => { - let input = document.createElement('input'); + if (!user) return; + + const input = document.createElement('input'); input.type = 'file'; input.accept = 'image/*'; @@ -98,7 +98,7 @@ const changeAvatar = async () => { newPfpFile = file const reader = new FileReader(); - reader.addEventListener("onload", (e: Event) => { + reader.addEventListener("onload", () => { if (reader.result && typeof reader.result === 'string') { user.avatar = reader.result; } @@ -121,7 +121,7 @@ const deleteAccount = async () => { diff --git a/components/Message.vue b/components/Message.vue index 5cd7773..05392a0 100644 --- a/components/Message.vue +++ b/components/Message.vue @@ -81,7 +81,7 @@ onMounted(async () => { text-align: left; /* border: 1px solid lightcoral; */ display: grid; - grid-template-columns: 2dvw 1fr; + grid-template-columns: 2rem 1fr; align-items: center; column-gap: 1dvw; width: 100%; @@ -129,10 +129,11 @@ onMounted(async () => { } .left-column { + min-width: 2rem; display: flex; + justify-content: center; text-align: center; white-space: nowrap; - } .author-username { diff --git a/components/UserArea.vue b/components/UserArea.vue new file mode 100644 index 0000000..d922c3f --- /dev/null +++ b/components/UserArea.vue @@ -0,0 +1,20 @@ + + + + + \ No newline at end of file diff --git a/components/UserPopup.vue b/components/UserPopup.vue index 092e7d5..befe4f5 100644 --- a/components/UserPopup.vue +++ b/components/UserPopup.vue @@ -1,6 +1,8 @@ \ No newline at end of file From 768b011961d52159500be5c7b2f7328d9a2d11ef Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Sat, 5 Jul 2025 17:02:22 +0200 Subject: [PATCH 049/170] feat: add theme previews --- .../Settings/AppSettings/Appearance.vue | 58 ++++++++++++++++++- nuxt.config.ts | 3 + public/themes/ash.css | 19 ++++++ public/themes/ash.json | 6 ++ public/themes/dark.json | 6 ++ public/themes/default-themes.json | 4 -- public/themes/light.json | 6 ++ 7 files changed, 96 insertions(+), 6 deletions(-) create mode 100644 public/themes/ash.css create mode 100644 public/themes/ash.json create mode 100644 public/themes/dark.json delete mode 100644 public/themes/default-themes.json create mode 100644 public/themes/light.json diff --git a/components/Settings/AppSettings/Appearance.vue b/components/Settings/AppSettings/Appearance.vue index 51b06ee..59e417c 100644 --- a/components/Settings/AppSettings/Appearance.vue +++ b/components/Settings/AppSettings/Appearance.vue @@ -1,12 +1,66 @@ \ No newline at end of file + display: inline-block; + text-align: center; + align-content: center; +} + +.theme-title { + font-size: .8em; + line-height: 6em; /* same height as the parent to centre it vertically */ +} + diff --git a/nuxt.config.ts b/nuxt.config.ts index 05a40fa..489e1b8 100644 --- a/nuxt.config.ts +++ b/nuxt.config.ts @@ -30,6 +30,9 @@ export default defineNuxtConfig({ messageGroupingMaxDifference: 300000, buildTimeString: new Date().toISOString(), gitHash: process.env.GIT_SHORT_REV || "N/A", + defaultThemes: [ + "light", "ash", "dark" + ] } }, /* nitro: { diff --git a/public/themes/ash.css b/public/themes/ash.css new file mode 100644 index 0000000..b685551 --- /dev/null +++ b/public/themes/ash.css @@ -0,0 +1,19 @@ +:root { + --text-color: #f0e5e0; + --secondary-text-color: #e8e0db; + + --chat-background-color: #2f2e2d; + --chat-highlighted-background-color: #3f3b38; + --sidebar-background-color: #3e3a37; + --sidebar-highlighted-background-color: #46423b; + --topbar-background-color: #3a3733; + + --padding-color: #e0e0e0; + + --primary-color: #f07028; + --primary-highlighted-color: #f28f4b; + --secondary-color: #683820; + --secondary-highlighted-color: #885830; + --accent-color: #a04b24; + --accent-highlighted-color: #b86038; +} \ No newline at end of file diff --git a/public/themes/ash.json b/public/themes/ash.json new file mode 100644 index 0000000..fb9cc93 --- /dev/null +++ b/public/themes/ash.json @@ -0,0 +1,6 @@ +{ + "displayName": "Ash", + "previewGradient": "45deg, #2f2e2d, #46423b", + "complementaryColor": "white", + "themeData": "ash.css" +} \ No newline at end of file diff --git a/public/themes/dark.json b/public/themes/dark.json new file mode 100644 index 0000000..3cecba6 --- /dev/null +++ b/public/themes/dark.json @@ -0,0 +1,6 @@ +{ + "displayName": "Dark", + "previewGradient": "45deg, #1f1e1d, #36322b", + "complementaryColor": "white", + "themeData": "dark.css" +} \ No newline at end of file diff --git a/public/themes/default-themes.json b/public/themes/default-themes.json deleted file mode 100644 index fb9478d..0000000 --- a/public/themes/default-themes.json +++ /dev/null @@ -1,4 +0,0 @@ -[ - "dark.css", - "light.css" -] \ No newline at end of file diff --git a/public/themes/light.json b/public/themes/light.json new file mode 100644 index 0000000..fe0b678 --- /dev/null +++ b/public/themes/light.json @@ -0,0 +1,6 @@ +{ + "displayName": "Light", + "previewGradient": "45deg, #f0ebe8, #d4d0ca", + "complementaryColor": "black", + "themeData": "light.css" +} \ No newline at end of file From c03f72ceccf81f7501b4ae71d711959bdf66465d Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Sat, 5 Jul 2025 17:05:40 +0200 Subject: [PATCH 050/170] feat: implement "hash navigation" for settings --- pages/settings.vue | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/pages/settings.vue b/pages/settings.vue index 0f297e3..01b78d7 100644 --- a/pages/settings.vue +++ b/pages/settings.vue @@ -40,10 +40,10 @@ From 441dc0c15cdb3391db283e89ec678970ca9e6b1c Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Sat, 5 Jul 2025 17:36:08 +0200 Subject: [PATCH 052/170] feat: actually add theme switching :mind_blown: --- .../Settings/AppSettings/Appearance.vue | 29 ++++++++++++++++++- public/themes/ash.json | 2 +- public/themes/dark.json | 2 +- public/themes/light.json | 2 +- 4 files changed, 31 insertions(+), 4 deletions(-) diff --git a/components/Settings/AppSettings/Appearance.vue b/components/Settings/AppSettings/Appearance.vue index 68759d9..0f7b504 100644 --- a/components/Settings/AppSettings/Appearance.vue +++ b/components/Settings/AppSettings/Appearance.vue @@ -5,7 +5,11 @@

THEMES

- + {{ theme.displayName }} @@ -25,23 +29,45 @@ const runtimeConfig = useRuntimeConfig() const defaultThemes = runtimeConfig.public.defaultThemes const baseURL = runtimeConfig.app.baseURL; +let themeLinkElement: HTMLLinkElement | null = null; const themes: Array = [] interface Theme { + ID: string displayName: string previewGradient: string complementaryColor: string themeURL: string } +function changeTheme(ID: string, URL: string) { + if (themeLinkElement && themeLinkElement.getAttribute('href') === `${baseURL}themes/${URL}`) { + return; + } + + localStorage.setItem("selectedTheme", ID); + + // if the theme didn't originally load for some reason, create it + if (!themeLinkElement) { + themeLinkElement = document.createElement('link'); + themeLinkElement.rel = 'stylesheet'; + document.head.appendChild(themeLinkElement); + } + + themeLinkElement.href = `${baseURL}themes/${URL}`; +} const fetchThemes = async () => { for (const theme of defaultThemes) { const themeConfig = await fetch(`${baseURL}themes/${theme}.json`) const themeConfigJson = await themeConfig.json() as Theme + themeConfigJson.ID = theme + themes.push(themeConfigJson) } + + console.log(themes) } await fetchThemes() @@ -67,6 +93,7 @@ await fetchThemes() display: inline-block; text-align: center; align-content: center; + cursor: pointer; } .theme-title { diff --git a/public/themes/ash.json b/public/themes/ash.json index fb9cc93..1bd7670 100644 --- a/public/themes/ash.json +++ b/public/themes/ash.json @@ -2,5 +2,5 @@ "displayName": "Ash", "previewGradient": "45deg, #2f2e2d, #46423b", "complementaryColor": "white", - "themeData": "ash.css" + "themeURL": "ash.css" } \ No newline at end of file diff --git a/public/themes/dark.json b/public/themes/dark.json index 3cecba6..0ff69be 100644 --- a/public/themes/dark.json +++ b/public/themes/dark.json @@ -2,5 +2,5 @@ "displayName": "Dark", "previewGradient": "45deg, #1f1e1d, #36322b", "complementaryColor": "white", - "themeData": "dark.css" + "themeURL": "dark.css" } \ No newline at end of file diff --git a/public/themes/light.json b/public/themes/light.json index fe0b678..3745abb 100644 --- a/public/themes/light.json +++ b/public/themes/light.json @@ -2,5 +2,5 @@ "displayName": "Light", "previewGradient": "45deg, #f0ebe8, #d4d0ca", "complementaryColor": "black", - "themeData": "light.css" + "themeURL": "light.css" } \ No newline at end of file From 6abfd8e44bcf8f232e251e64269e7532612ec42f Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Sat, 5 Jul 2025 19:02:57 +0200 Subject: [PATCH 053/170] chore: pascalCase --- components/Settings/AppSettings/Appearance.vue | 16 ++++++++-------- public/themes/ash.json | 2 +- public/themes/dark.json | 2 +- public/themes/light.json | 2 +- 4 files changed, 11 insertions(+), 11 deletions(-) diff --git a/components/Settings/AppSettings/Appearance.vue b/components/Settings/AppSettings/Appearance.vue index 0f7b504..82e3845 100644 --- a/components/Settings/AppSettings/Appearance.vue +++ b/components/Settings/AppSettings/Appearance.vue @@ -8,7 +8,7 @@ {{ theme.displayName }} @@ -34,19 +34,19 @@ let themeLinkElement: HTMLLinkElement | null = null; const themes: Array = [] interface Theme { - ID: string + id: string displayName: string previewGradient: string complementaryColor: string - themeURL: string + themeUrl: string } -function changeTheme(ID: string, URL: string) { - if (themeLinkElement && themeLinkElement.getAttribute('href') === `${baseURL}themes/${URL}`) { +function changeTheme(id: string, url: string) { + if (themeLinkElement && themeLinkElement.getAttribute('href') === `${baseURL}themes/${url}`) { return; } - localStorage.setItem("selectedTheme", ID); + localStorage.setItem("selectedTheme", id); // if the theme didn't originally load for some reason, create it if (!themeLinkElement) { @@ -55,14 +55,14 @@ function changeTheme(ID: string, URL: string) { document.head.appendChild(themeLinkElement); } - themeLinkElement.href = `${baseURL}themes/${URL}`; + themeLinkElement.href = `${baseURL}themes/${url}`; } const fetchThemes = async () => { for (const theme of defaultThemes) { const themeConfig = await fetch(`${baseURL}themes/${theme}.json`) const themeConfigJson = await themeConfig.json() as Theme - themeConfigJson.ID = theme + themeConfigJson.id = theme themes.push(themeConfigJson) } diff --git a/public/themes/ash.json b/public/themes/ash.json index 1bd7670..d5d2a59 100644 --- a/public/themes/ash.json +++ b/public/themes/ash.json @@ -2,5 +2,5 @@ "displayName": "Ash", "previewGradient": "45deg, #2f2e2d, #46423b", "complementaryColor": "white", - "themeURL": "ash.css" + "themeUrl": "ash.css" } \ No newline at end of file diff --git a/public/themes/dark.json b/public/themes/dark.json index 0ff69be..4731d43 100644 --- a/public/themes/dark.json +++ b/public/themes/dark.json @@ -2,5 +2,5 @@ "displayName": "Dark", "previewGradient": "45deg, #1f1e1d, #36322b", "complementaryColor": "white", - "themeURL": "dark.css" + "themeUrl": "dark.css" } \ No newline at end of file diff --git a/public/themes/light.json b/public/themes/light.json index 3745abb..b95c78b 100644 --- a/public/themes/light.json +++ b/public/themes/light.json @@ -2,5 +2,5 @@ "displayName": "Light", "previewGradient": "45deg, #f0ebe8, #d4d0ca", "complementaryColor": "black", - "themeURL": "light.css" + "themeUrl": "light.css" } \ No newline at end of file From 7098dda6b4f1a6d530978caa8120d2552ac303be Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Sat, 5 Jul 2025 19:03:24 +0200 Subject: [PATCH 054/170] fix: remove un-necessary imports --- pages/settings.vue | 3 --- 1 file changed, 3 deletions(-) diff --git a/pages/settings.vue b/pages/settings.vue index 01b78d7..17558b1 100644 --- a/pages/settings.vue +++ b/pages/settings.vue @@ -40,9 +40,6 @@ + + \ No newline at end of file From bb5ff3750967a938ad8daec495c20893d264cbef Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Tue, 8 Jul 2025 20:58:40 +0200 Subject: [PATCH 072/170] fix: put the home page into index.vue instead --- layouts/client.vue | 2 +- pages/home.vue | 30 ------------------------------ pages/index.vue | 15 ++++++++++++++- 3 files changed, 15 insertions(+), 32 deletions(-) delete mode 100644 pages/home.vue diff --git a/layouts/client.vue b/layouts/client.vue index 516658c..a1ee86d 100644 --- a/layouts/client.vue +++ b/layouts/client.vue @@ -7,7 +7,7 @@
- +
diff --git a/pages/home.vue b/pages/home.vue deleted file mode 100644 index 4182eb3..0000000 --- a/pages/home.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - - - \ No newline at end of file diff --git a/pages/index.vue b/pages/index.vue index f970926..4182eb3 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -1,6 +1,19 @@ From bd6307f16e06cc2b53b62ab2017c9cfdf29c7ca8 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Tue, 8 Jul 2025 21:00:05 +0200 Subject: [PATCH 073/170] fix: rephrase sentace from "server" to "guild" --- pages/index.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pages/index.vue b/pages/index.vue index 4182eb3..41deadf 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -7,7 +7,7 @@ Welcome to gorb :3

- Click on a server to the left to view a guild. + Click on a guild to the left to view a guild.
Or click the button in the bottom left to join a guild.

From 8932070fcc64fae57036b9e5fc4d08398e236d68 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Tue, 8 Jul 2025 21:11:14 +0200 Subject: [PATCH 074/170] feat: spice up the home bar --- layouts/client.vue | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/layouts/client.vue b/layouts/client.vue index a1ee86d..9ce451e 100644 --- a/layouts/client.vue +++ b/layouts/client.vue @@ -3,7 +3,9 @@
- main bar + + gorb!!!!! +
@@ -61,6 +63,11 @@ const guilds: GuildResponse[] | undefined = await fetchWithApi("/me/guilds"); background-color: var(--topbar-background-color); padding-left: 5dvw; padding-right: 5dvw; + +} + +.homebar-item { + width: 100dvw; } #client-root>div:nth-child(-n+4) { From 730b0cb1dcece7264d81e07902e1576e7d92b1cb Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Wed, 9 Jul 2025 00:25:52 +0200 Subject: [PATCH 075/170] refactor: change the client from table to flexbox this makes the server, channel, and member list a constant size, making the text messages take up the entire remaining width this also fixes the text wrapping you have already fixed on one of your branches this change is required if we want to make the member list toggelable, or channel list resizable --- components/Channel.vue | 2 +- layouts/client.vue | 89 ++++++++----------- .../[serverId]/channels/[channelId].vue | 13 ++- 3 files changed, 46 insertions(+), 58 deletions(-) diff --git a/components/Channel.vue b/components/Channel.vue index 0f48323..6bdc28b 100644 --- a/components/Channel.vue +++ b/components/Channel.vue @@ -30,7 +30,7 @@ const isCurrentChannel = props.uuid == props.currentUuid; .channel-list-link-container { text-align: left; display: flex; - height: 4dvh; + height: 1.5em; white-space: nowrap; align-items: center; } diff --git a/layouts/client.vue b/layouts/client.vue index a1ee86d..b98e304 100644 --- a/layouts/client.vue +++ b/layouts/client.vue @@ -6,21 +6,23 @@ main bar
-
- - - -
- - - +
+
+ + + +
+ + + + +
+ +
- - - +
-
@@ -34,11 +36,10 @@ const guilds: GuildResponse[] | undefined = await fetchWithApi("/me/guilds"); \ No newline at end of file diff --git a/pages/servers/[serverId]/channels/[channelId].vue b/pages/servers/[serverId]/channels/[channelId].vue index 6bdcc7c..b5ee86a 100644 --- a/pages/servers/[serverId]/channels/[channelId].vue +++ b/pages/servers/[serverId]/channels/[channelId].vue @@ -91,9 +91,8 @@ function handleMemberClick(member: GuildMemberResponse) { } #members-container { - padding-top: 1dvh; - padding-left: 1dvw; - padding-right: 1dvw; + min-width: 12rem; + padding-top: 1em; border-left: 1px solid var(--padding-color); } @@ -102,14 +101,14 @@ function handleMemberClick(member: GuildMemberResponse) { flex-direction: column; overflow-y: scroll; max-height: 92dvh; - padding-left: 1dvw; - padding-right: 1dvw; + padding-left: 1.3em; + padding-right: 1.3em; margin-top: 1dvh; } .member-item { display: grid; - grid-template-columns: 2dvw 1fr; + grid-template-columns: 1.5em 1fr; margin-top: .5em; margin-bottom: .5em; gap: 1em; @@ -121,7 +120,7 @@ function handleMemberClick(member: GuildMemberResponse) { #channels-list { display: flex; flex-direction: column; - gap: 1dvh; + gap: .5em; } .member-avatar { From 9a2fe8fb373c006ac074031057d0fe4e5b90fa62 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Wed, 9 Jul 2025 00:43:23 +0200 Subject: [PATCH 076/170] refactor: change a lot of dynamic sizes to em and rem this makes the client feel a LOT snappier --- components/Button.vue | 2 +- components/Channel.vue | 4 ++-- components/MessageArea.vue | 1 + layouts/client.vue | 20 ++++++++-------- .../[serverId]/channels/[channelId].vue | 23 ++++++++++--------- 5 files changed, 26 insertions(+), 24 deletions(-) diff --git a/components/Button.vue b/components/Button.vue index fb44cf2..66706de 100644 --- a/components/Button.vue +++ b/components/Button.vue @@ -21,7 +21,7 @@ const props = defineProps<{ background-color: var(--primary-color); color: var(--text-color); - padding: 0.7dvh 1.2dvw; + padding: 0.4em 0.75em; font-size: 1.1em; transition: background-color 0.2s; diff --git a/components/Channel.vue b/components/Channel.vue index 6bdc28b..98f210e 100644 --- a/components/Channel.vue +++ b/components/Channel.vue @@ -23,8 +23,8 @@ const isCurrentChannel = props.uuid == props.currentUuid; .channel-list-link { text-decoration: none; color: inherit; - padding-left: .5dvw; - padding-right: .5dvw; + padding-left: .25em; + padding-right: .25em; } .channel-list-link-container { diff --git a/components/MessageArea.vue b/components/MessageArea.vue index 18b9ac5..244b239 100644 --- a/components/MessageArea.vue +++ b/components/MessageArea.vue @@ -246,6 +246,7 @@ router.beforeEach((to, from, next) => { padding-left: 1dvw; padding-right: 1dvw; overflow: hidden; + flex-grow: 1; } #message-box { diff --git a/layouts/client.vue b/layouts/client.vue index b98e304..469800d 100644 --- a/layouts/client.vue +++ b/layouts/client.vue @@ -74,27 +74,27 @@ const guilds: GuildResponse[] | undefined = await fetchWithApi("/me/guilds"); #left-column { display: flex; flex-direction: column; - gap: 2dvh; - padding-left: .5dvw; - padding-right: .5dvw; + gap: .75em; + padding-left: .25em; + padding-right: .25em; border-right: 1px solid var(--padding-color); background: var(--optional-sidebar-background); background-color: var(--sidebar-background-color); - padding-top: 1.5dvh; + padding-top: .5em; } #servers-list { display: flex; flex-direction: column; - gap: 1dvh; + gap: 1em; width: 3.2rem; } #middle-left-column { - padding-left: 1dvw; - padding-right: 1dvw; + padding-left: .25em; + padding-right: .25em; border-right: 1px solid var(--padding-color); - min-width: 10rem; + min-width: 10em; overflow-y: scroll; overflow-x: hidden; } @@ -106,12 +106,12 @@ const guilds: GuildResponse[] | undefined = await fetchWithApi("/me/guilds"); #home-button { border-bottom: 1px solid var(--padding-color); - padding-bottom: 1dvh; + padding-bottom: .375em; } #settings-menu { position: absolute; - bottom: .25dvh + bottom: .25em } \ No newline at end of file diff --git a/pages/servers/[serverId]/channels/[channelId].vue b/pages/servers/[serverId]/channels/[channelId].vue index b5ee86a..04d56f9 100644 --- a/pages/servers/[serverId]/channels/[channelId].vue +++ b/pages/servers/[serverId]/channels/[channelId].vue @@ -27,6 +27,7 @@
+
@@ -83,35 +84,35 @@ function handleMemberClick(member: GuildMemberResponse) { From a6572c20f971c4f0d8e05d99f6fac86f29c59541 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Wed, 9 Jul 2025 01:04:37 +0200 Subject: [PATCH 078/170] fix: remove accidental duplication of member list this was for local testing, forgot to remove it --- pages/servers/[serverId]/channels/[channelId].vue | 1 - 1 file changed, 1 deletion(-) diff --git a/pages/servers/[serverId]/channels/[channelId].vue b/pages/servers/[serverId]/channels/[channelId].vue index 04d56f9..d0c702d 100644 --- a/pages/servers/[serverId]/channels/[channelId].vue +++ b/pages/servers/[serverId]/channels/[channelId].vue @@ -27,7 +27,6 @@
-
From f1bec945fe0cd7a23eccb9a499a0b11da4de951a Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Wed, 9 Jul 2025 03:36:30 +0200 Subject: [PATCH 079/170] feat: multiline message box this implementation SUCKS and i probably have to write an entirely custom solution where every line is a div or something --- components/MessageArea.vue | 64 +++++++++++++++++++++++--------------- 1 file changed, 39 insertions(+), 25 deletions(-) diff --git a/components/MessageArea.vue b/components/MessageArea.vue index 9bf6df8..34a79fa 100644 --- a/components/MessageArea.vue +++ b/components/MessageArea.vue @@ -14,9 +14,11 @@
- - +
- - +
+ + + +
+ +
+
+
+
+ +
+ + + + +
@@ -106,11 +123,38 @@ function pushMessage(message: MessageResponse) { messages.value.push(message); } +function handleTextboxKeyDown(event: KeyboardEvent) { + if (event.key === "Enter" && event.shiftKey && messageTextboxInput.value) { + // this enters a newline, due to not preventing default + } else if (event.key === "Enter") { + event.preventDefault() + sendMessage(event) + } + + adjustTextboxHeight() +} + +function handleTextboxInput() { + if (messageTextboxInput.value) { + messageInput.value = messageTextboxInput.value.innerText; + } + + adjustTextboxHeight() +} + +// this technically uses pixel units, but it's still set using dynamic units +function adjustTextboxHeight() { + if (messageTextboxInput.value && messageTextboxDisplay.value) { + messageTextboxInput.value.style.height = "auto" + messageTextboxInput.value.style.height = `${messageTextboxInput.value.scrollHeight}px` + } +} + const messages = ref([]); - -const messageInput = ref(); - +const messageInput = ref(""); const messagesElement = ref(); +const messageTextboxInput = ref(); +const messageTextboxDisplay = ref(); if (messagesRes) messages.value = messagesRes; @@ -158,14 +202,21 @@ if (accessToken && apiBase) { function sendMessage(e: Event) { e.preventDefault(); - const message = { - message: messageInput.value - } - console.log("message:", message); - if (message.message) { + if (messageInput.value && messageInput.value.trim() !== "") { + const message = { + message: messageInput.value.trim().replace(/\n/g, "
") // trim, and replace \n with
+ } + + console.log("message:", message); ws.send(JSON.stringify(message)); - messageInput.value = ""; - console.log("MESSAGE SENT!!!"); + + // reset input field + messageInput.value = "" + if (messageTextboxInput.value) { + messageTextboxInput.value.innerText = "" + } + + adjustTextboxHeight() } } @@ -241,38 +292,63 @@ router.beforeEach((to, from, next) => { \ No newline at end of file diff --git a/pages/index.vue b/pages/index.vue index f970926..41deadf 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -1,6 +1,19 @@ diff --git a/pages/servers/[serverId]/channels/[channelId].vue b/pages/servers/[serverId]/channels/[channelId].vue index 6bdcc7c..5c55655 100644 --- a/pages/servers/[serverId]/channels/[channelId].vue +++ b/pages/servers/[serverId]/channels/[channelId].vue @@ -83,36 +83,36 @@ function handleMemberClick(member: GuildMemberResponse) { \ No newline at end of file From 2790772cb7c1fd9a73a3f6df766a9e9be7ff0906 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Thu, 10 Jul 2025 16:32:41 +0200 Subject: [PATCH 105/170] fix: some of the worst merging i've done in my life --- layouts/client.vue | 47 +--------------------------------------------- 1 file changed, 1 insertion(+), 46 deletions(-) diff --git a/layouts/client.vue b/layouts/client.vue index bd3921a..a28d6bc 100644 --- a/layouts/client.vue +++ b/layouts/client.vue @@ -25,23 +25,6 @@
-
-
- - - -
- - - - -
- - - -
- -
@@ -69,11 +52,9 @@ const guilds: GuildResponse[] | undefined = await fetchWithApi("/me/guilds"); .visible { opacity: 100%; transition: opacity 500ms; - transition: opacity 500ms; } #homebar { - min-height: 4dvh; min-height: 4dvh; display: flex; justify-content: space-evenly; @@ -81,14 +62,8 @@ const guilds: GuildResponse[] | undefined = await fetchWithApi("/me/guilds"); background: var(--optional-topbar-background); background-color: var(--topbar-background-color); border-bottom: 1px solid var(--padding-color); - border-bottom: 1px solid var(--padding-color); padding-left: 5dvw; padding-right: 5dvw; - -} - -.homebar-item { - width: 100dvw; } .homebar-item { @@ -100,9 +75,6 @@ const guilds: GuildResponse[] | undefined = await fetchWithApi("/me/guilds"); flex-direction: row; flex-grow: 1; overflow: auto; - flex-direction: row; - flex-grow: 1; - overflow: auto; } #left-column { @@ -111,13 +83,10 @@ const guilds: GuildResponse[] | undefined = await fetchWithApi("/me/guilds"); gap: .75em; padding-left: .25em; padding-right: .25em; - gap: .75em; - padding-left: .25em; - padding-right: .25em; + padding-top: .5em; border-right: 1px solid var(--padding-color); background: var(--optional-sidebar-background); background-color: var(--sidebar-background-color); - padding-top: .5em; } #servers-list { @@ -128,16 +97,7 @@ const guilds: GuildResponse[] | undefined = await fetchWithApi("/me/guilds"); padding-top: .5em; } -#servers-list { - display: flex; - flex-direction: column; - gap: 1em; - width: 3.2rem; -} - #middle-left-column { - padding-left: .25em; - padding-right: .25em; padding-left: .25em; padding-right: .25em; border-right: 1px solid var(--padding-color); @@ -154,11 +114,6 @@ const guilds: GuildResponse[] | undefined = await fetchWithApi("/me/guilds"); overflow-x: hidden; } -.sidebar-icon { - width: 3rem; - height: 3rem; -} - #home-button { border-bottom: 1px solid var(--padding-color); padding-bottom: .375em; From f59162bad596ac953d0eeba91529b3952f4eb2a8 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Thu, 10 Jul 2025 20:13:25 +0200 Subject: [PATCH 106/170] fix: width of icon and channel lists --- layouts/client.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/layouts/client.vue b/layouts/client.vue index a28d6bc..966e60a 100644 --- a/layouts/client.vue +++ b/layouts/client.vue @@ -102,6 +102,7 @@ const guilds: GuildResponse[] | undefined = await fetchWithApi("/me/guilds"); padding-right: .25em; border-right: 1px solid var(--padding-color); min-width: 13em; + max-width: 13em; overflow-y: scroll; overflow-x: hidden; } @@ -109,7 +110,6 @@ const guilds: GuildResponse[] | undefined = await fetchWithApi("/me/guilds"); .sidebar-icon { width: 3rem; height: 3rem; - min-width: 10em; overflow-y: scroll; overflow-x: hidden; } From 04358e9c917c00b95b7debd51b7f476e2a79472c Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Thu, 10 Jul 2025 21:04:27 +0200 Subject: [PATCH 107/170] feat: make settings menu remember your page on reload --- pages/settings.vue | 1 + 1 file changed, 1 insertion(+) diff --git a/pages/settings.vue b/pages/settings.vue index 3aac506..6bf3c9e 100644 --- a/pages/settings.vue +++ b/pages/settings.vue @@ -98,6 +98,7 @@ let currentPage = ref(categories[0].pages[0]); let selectedPage = ref(currentPage.value.displayName); // used to highlight the current channel function selectCategory(page: Page) { + window.location.hash = page.displayName.toLowerCase() currentPage.value = page; selectedPage.value = page.displayName; }; From 71242d0543ace0b581e01cf09ab8a44d33b882d3 Mon Sep 17 00:00:00 2001 From: justtemmie Date: Thu, 10 Jul 2025 19:37:04 +0000 Subject: [PATCH 108/170] revert 04358e9c917c00b95b7debd51b7f476e2a79472c revert feat: make settings menu remember your page on reload it breaks the back button, my bad --- pages/settings.vue | 1 - 1 file changed, 1 deletion(-) diff --git a/pages/settings.vue b/pages/settings.vue index 6bf3c9e..3aac506 100644 --- a/pages/settings.vue +++ b/pages/settings.vue @@ -98,7 +98,6 @@ let currentPage = ref(categories[0].pages[0]); let selectedPage = ref(currentPage.value.displayName); // used to highlight the current channel function selectCategory(page: Page) { - window.location.hash = page.displayName.toLowerCase() currentPage.value = page; selectedPage.value = page.displayName; }; From a90f06218126547a1e3c681515895c8f0efbd3d3 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Thu, 10 Jul 2025 21:53:25 +0200 Subject: [PATCH 109/170] refactor: move the homepage to /me from / --- layouts/client.vue | 2 +- pages/index.vue | 16 ++-------------- pages/me/index.vue | 30 ++++++++++++++++++++++++++++++ 3 files changed, 33 insertions(+), 15 deletions(-) create mode 100644 pages/me/index.vue diff --git a/layouts/client.vue b/layouts/client.vue index 966e60a..de1e029 100644 --- a/layouts/client.vue +++ b/layouts/client.vue @@ -10,7 +10,7 @@
- +
diff --git a/pages/index.vue b/pages/index.vue index 41deadf..cb5f57e 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -1,23 +1,11 @@ + + \ No newline at end of file From b1a3ce9b00977c4bf74af610f944c885eb2ef719 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Thu, 10 Jul 2025 22:18:28 +0200 Subject: [PATCH 110/170] feat: update interface to include friends_since --- types/interfaces.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/types/interfaces.ts b/types/interfaces.ts index 610d007..7b9a97b 100644 --- a/types/interfaces.ts +++ b/types/interfaces.ts @@ -61,7 +61,8 @@ export interface UserResponse { pronouns: string | null, about: string | null, email?: string, - email_verified?: boolean + email_verified?: boolean, + friends_since: string | null, } export interface StatsResponse { From 8a9ecaa2e2ead30576367a2bd275c70edeb1da19 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Thu, 10 Jul 2025 22:44:18 +0200 Subject: [PATCH 111/170] refactor: move spacer into it's own component --- components/VerticalSpacer.vue | 21 +++++++++++++++++++++ 1 file changed, 21 insertions(+) create mode 100644 components/VerticalSpacer.vue diff --git a/components/VerticalSpacer.vue b/components/VerticalSpacer.vue new file mode 100644 index 0000000..293e9f0 --- /dev/null +++ b/components/VerticalSpacer.vue @@ -0,0 +1,21 @@ + + + + + From 5dbf21b0abb975d98ae1e825fd6edaf01fab36dc Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Thu, 10 Jul 2025 22:44:46 +0200 Subject: [PATCH 112/170] feat: implement friends list --- components/DirectMessagesSidebar.vue | 38 ++++++++++++++++++++++++++++ components/UserEntry.vue | 35 +++++++++++++++++++++++++ 2 files changed, 73 insertions(+) create mode 100644 components/DirectMessagesSidebar.vue create mode 100644 components/UserEntry.vue diff --git a/components/DirectMessagesSidebar.vue b/components/DirectMessagesSidebar.vue new file mode 100644 index 0000000..d9f677d --- /dev/null +++ b/components/DirectMessagesSidebar.vue @@ -0,0 +1,38 @@ + + + + + \ No newline at end of file diff --git a/components/UserEntry.vue b/components/UserEntry.vue new file mode 100644 index 0000000..dcea368 --- /dev/null +++ b/components/UserEntry.vue @@ -0,0 +1,35 @@ + + + + + From 15e5a21277f487174f66dcc6113edf2aae2265bd Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Thu, 10 Jul 2025 22:47:52 +0200 Subject: [PATCH 113/170] refactor: try sorting components into sub-folders --- components/{ => Guild}/Channel.vue | 0 components/{ => Member}/MemberEntry.vue | 0 components/{ => Popups}/CropPopup.vue | 0 components/{ => Popups}/InvitePopup.vue | 0 components/{ => Popups}/Loading.vue | 0 components/{ => User}/UserEntry.vue | 0 components/{ => User}/UserPopup.vue | 0 components/UserArea.vue | 20 ------------------- components/{ => UserInterface}/Button.vue | 0 .../{ => UserInterface}/VerticalSpacer.vue | 0 10 files changed, 20 deletions(-) rename components/{ => Guild}/Channel.vue (100%) rename components/{ => Member}/MemberEntry.vue (100%) rename components/{ => Popups}/CropPopup.vue (100%) rename components/{ => Popups}/InvitePopup.vue (100%) rename components/{ => Popups}/Loading.vue (100%) rename components/{ => User}/UserEntry.vue (100%) rename components/{ => User}/UserPopup.vue (100%) delete mode 100644 components/UserArea.vue rename components/{ => UserInterface}/Button.vue (100%) rename components/{ => UserInterface}/VerticalSpacer.vue (100%) diff --git a/components/Channel.vue b/components/Guild/Channel.vue similarity index 100% rename from components/Channel.vue rename to components/Guild/Channel.vue diff --git a/components/MemberEntry.vue b/components/Member/MemberEntry.vue similarity index 100% rename from components/MemberEntry.vue rename to components/Member/MemberEntry.vue diff --git a/components/CropPopup.vue b/components/Popups/CropPopup.vue similarity index 100% rename from components/CropPopup.vue rename to components/Popups/CropPopup.vue diff --git a/components/InvitePopup.vue b/components/Popups/InvitePopup.vue similarity index 100% rename from components/InvitePopup.vue rename to components/Popups/InvitePopup.vue diff --git a/components/Loading.vue b/components/Popups/Loading.vue similarity index 100% rename from components/Loading.vue rename to components/Popups/Loading.vue diff --git a/components/UserEntry.vue b/components/User/UserEntry.vue similarity index 100% rename from components/UserEntry.vue rename to components/User/UserEntry.vue diff --git a/components/UserPopup.vue b/components/User/UserPopup.vue similarity index 100% rename from components/UserPopup.vue rename to components/User/UserPopup.vue diff --git a/components/UserArea.vue b/components/UserArea.vue deleted file mode 100644 index d922c3f..0000000 --- a/components/UserArea.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - - - \ No newline at end of file diff --git a/components/Button.vue b/components/UserInterface/Button.vue similarity index 100% rename from components/Button.vue rename to components/UserInterface/Button.vue diff --git a/components/VerticalSpacer.vue b/components/UserInterface/VerticalSpacer.vue similarity index 100% rename from components/VerticalSpacer.vue rename to components/UserInterface/VerticalSpacer.vue From 59000709fe5f3ae0c3b7f3254870481094e90da2 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Thu, 10 Jul 2025 22:51:14 +0200 Subject: [PATCH 114/170] feat: update api --- composables/api.ts | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/composables/api.ts b/composables/api.ts index d2ca7a0..8a37a8e 100644 --- a/composables/api.ts +++ b/composables/api.ts @@ -1,4 +1,4 @@ -import type { ChannelResponse, GuildMemberResponse, GuildResponse, MessageResponse, StatsResponse } from "~/types/interfaces"; +import type { ChannelResponse, GuildMemberResponse, GuildResponse, MessageResponse, StatsResponse, UserResponse } from "~/types/interfaces"; export const useApi = () => { async function fetchGuilds(): Promise { @@ -24,14 +24,18 @@ export const useApi = () => { async function fetchMember(guildId: string, memberId: string): Promise { return await fetchWithApi(`/guilds/${guildId}/members/${memberId}`); } - + async function fetchUsers() { return await fetchWithApi(`/users`); } - + async function fetchUser(userId: string) { return await fetchWithApi(`/users/${userId}`); } + + async function fetchFriends(): Promise { + return await fetchWithApi('/me/friends') + } async function fetchMessages(channelId: string, options?: { amount?: number, offset?: number }): Promise { return await fetchWithApi(`/channels/${channelId}/messages`, { query: { amount: options?.amount ?? 100, offset: options?.offset ?? 0 } }); @@ -59,6 +63,7 @@ export const useApi = () => { fetchMember, fetchUsers, fetchUser, + fetchFriends, fetchMessages, fetchMessage, fetchInstanceStats, From 8e69dc805e20e5feab0493b9b9aafac5a23f3c57 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Thu, 10 Jul 2025 22:51:56 +0200 Subject: [PATCH 115/170] chore: remove unused popups --- components/Member/MemberEntry.vue | 1 - components/Settings/UserSettings/Account.vue | 1 - components/Settings/UserSettings/Privacy.vue | 1 - pages/servers/[serverId]/channels/[channelId].vue | 1 - 4 files changed, 4 deletions(-) diff --git a/components/Member/MemberEntry.vue b/components/Member/MemberEntry.vue index ed4cd48..1ea4170 100644 --- a/components/Member/MemberEntry.vue +++ b/components/Member/MemberEntry.vue @@ -10,7 +10,6 @@ \ No newline at end of file diff --git a/components/User/UserEntry.vue b/components/User/UserEntry.vue index dcea368..b463759 100644 --- a/components/User/UserEntry.vue +++ b/components/User/UserEntry.vue @@ -24,7 +24,12 @@ const props = defineProps<{ margin-bottom: .5em; gap: .5em; - cursor: pointer; + text-decoration: none; + color: inherit; +} + +.user-item:hover { + background-color: #00000020 } .user-avatar { diff --git a/components/UserInterface/VerticalSpacer.vue b/components/UserInterface/VerticalSpacer.vue index 293e9f0..8ac1bd6 100644 --- a/components/UserInterface/VerticalSpacer.vue +++ b/components/UserInterface/VerticalSpacer.vue @@ -2,15 +2,6 @@ - - \ No newline at end of file diff --git a/components/DirectMessagesSidebar.vue b/components/Me/DirectMessagesSidebar.vue similarity index 73% rename from components/DirectMessagesSidebar.vue rename to components/Me/DirectMessagesSidebar.vue index dece975..5a0e99d 100644 --- a/components/DirectMessagesSidebar.vue +++ b/components/Me/DirectMessagesSidebar.vue @@ -5,24 +5,24 @@

Direct Messages

+ Friends +
- + :href="`/me/${user.uuid}`"/>
+ + \ No newline at end of file diff --git a/composables/api.ts b/composables/api.ts index 8a37a8e..0cd6db0 100644 --- a/composables/api.ts +++ b/composables/api.ts @@ -37,6 +37,14 @@ export const useApi = () => { return await fetchWithApi('/me/friends') } + async function addFriend(username: string): Promise { + await fetchWithApi('/me/friends', { method: "POST", body: { username } }); + } + + async function removeFriend(userId: string): Promise { + await fetchWithApi(`/me/friends/${userId}`, { method: "DELETE" }); + } + async function fetchMessages(channelId: string, options?: { amount?: number, offset?: number }): Promise { return await fetchWithApi(`/channels/${channelId}/messages`, { query: { amount: options?.amount ?? 100, offset: options?.offset ?? 0 } }); } @@ -64,6 +72,8 @@ export const useApi = () => { fetchUsers, fetchUser, fetchFriends, + addFriend, + removeFriend, fetchMessages, fetchMessage, fetchInstanceStats, diff --git a/pages/me/[userId].vue b/pages/me/[userId].vue new file mode 100644 index 0000000..d466938 --- /dev/null +++ b/pages/me/[userId].vue @@ -0,0 +1,20 @@ + + + + + \ No newline at end of file diff --git a/pages/me/friends.vue b/pages/me/friends.vue new file mode 100644 index 0000000..b284658 --- /dev/null +++ b/pages/me/friends.vue @@ -0,0 +1,82 @@ + + + + + \ No newline at end of file diff --git a/pages/me/index.vue b/pages/me/index.vue index 701481d..b075668 100644 --- a/pages/me/index.vue +++ b/pages/me/index.vue @@ -5,6 +5,8 @@ \ No newline at end of file From 2ff892b0da73a9d0e1ad5522e2dece2f74c7a16f Mon Sep 17 00:00:00 2001 From: SauceyRed Date: Fri, 11 Jul 2025 03:31:25 +0200 Subject: [PATCH 136/170] feat: add util to create MessageReply instance --- utils/replyToMessage.ts | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/utils/replyToMessage.ts b/utils/replyToMessage.ts index 03253d2..bbb453b 100644 --- a/utils/replyToMessage.ts +++ b/utils/replyToMessage.ts @@ -1,5 +1,14 @@ +import { render } from "vue"; +import MessageReply from "~/components/MessageReply.vue"; import type { MessageProps } from "~/types/props"; export default (element: HTMLDivElement, props: MessageProps) => { console.log("element:", element); + const messageBox = document.getElementById("message-box") as HTMLDivElement; + if (messageBox) { + const div = document.createElement("div"); + const messageReply = h(MessageReply, { author: props.author?.display_name || props.author!.username, text: props.text || "", id: props.message.uuid, replyId: props.replyMessage?.uuid || element.dataset.messageId!, maxWidth: "full" }); + messageBox.prepend(div); + render(messageReply, div); + } } From a8ee8122ee0f7d03a0e3abc65a9595d041684d56 Mon Sep 17 00:00:00 2001 From: SauceyRed Date: Fri, 11 Jul 2025 03:33:24 +0200 Subject: [PATCH 137/170] feat: implement message replies --- components/Message.vue | 27 ++++++++++++++++++++++++--- components/MessageArea.vue | 29 ++++++++++++++++++++++++++--- 2 files changed, 50 insertions(+), 6 deletions(-) diff --git a/components/Message.vue b/components/Message.vue index d3d4086..d86f0ad 100644 --- a/components/Message.vue +++ b/components/Message.vue @@ -1,5 +1,9 @@ + + \ No newline at end of file diff --git a/components/Settings/AppSettings/Appearance.vue b/components/Settings/AppSettings/Appearance.vue index a35e719..39e7410 100644 --- a/components/Settings/AppSettings/Appearance.vue +++ b/components/Settings/AppSettings/Appearance.vue @@ -17,11 +17,15 @@
-

ICONS

-
+ + +

TIME FORMAT

+
+
- -
@@ -70,6 +74,11 @@ async function fetchThemes() { } await fetchThemes() + + +async function onTimeFormatClicked(index: number) { + console.log(index) +} \ No newline at end of file From 890fbebbe9f3dd91d37ff605b1fc95aeaee1a2cc Mon Sep 17 00:00:00 2001 From: SauceyRed Date: Sat, 12 Jul 2025 18:58:09 +0200 Subject: [PATCH 153/170] feat: use \ No newline at end of file From eb4945075646eb595404ad743b6d39be418dc728 Mon Sep 17 00:00:00 2001 From: JustTemmie <47639983+JustTemmie@users.noreply.github.com> Date: Sat, 12 Jul 2025 20:43:25 +0200 Subject: [PATCH 162/170] feat: support 12 and 24 hour formats --- components/Message.vue | 3 ++- components/MessageArea.vue | 2 +- utils/getPreferredTimeFormat.ts | 11 +++++++++++ 3 files changed, 14 insertions(+), 2 deletions(-) create mode 100644 utils/getPreferredTimeFormat.ts diff --git a/components/Message.vue b/components/Message.vue index a8329dd..db08258 100644 --- a/components/Message.vue +++ b/components/Message.vue @@ -46,7 +46,8 @@ Yesterday at {{ date.toLocaleDateString(undefined) }}, - {{ date.toLocaleTimeString(undefined, { timeStyle: "short" }) }} + + {{ date.toLocaleTimeString(undefined, { hour12: props.format=="12", timeStyle: "short" }) }}
diff --git a/components/MessageArea.vue b/components/MessageArea.vue index b2338f5..d59b862 100644 --- a/components/MessageArea.vue +++ b/components/MessageArea.vue @@ -49,7 +49,7 @@ const me = await fetchWithApi("/me") as UserResponse; const messageTimestamps = ref>({}); const messagesType = ref>({}); const messageGroupingMaxDifference = useRuntimeConfig().public.messageGroupingMaxDifference -const timeFormat = settingLoad("timeFormat") ?? "24" +const timeFormat = getPreferredTimeFormat() const messagesRes: MessageResponse[] | undefined = await fetchWithApi( `${props.channelUrl}/messages`, diff --git a/utils/getPreferredTimeFormat.ts b/utils/getPreferredTimeFormat.ts new file mode 100644 index 0000000..4cf03e0 --- /dev/null +++ b/utils/getPreferredTimeFormat.ts @@ -0,0 +1,11 @@ +export default (): "12" | "24" => { + const format = settingLoad("timeFormat").timeFormat ?? "auto" + + if (format == "12-hour") { + return "12" + } else if (format == "24-hour") { + return "24" + } + + return "24" +} \ No newline at end of file From 6221359a156f27e292dee3d1bcd65313d15fa89d Mon Sep 17 00:00:00 2001 From: SauceyRed Date: Sat, 12 Jul 2025 22:20:28 +0200 Subject: [PATCH 163/170] style(ui): move homebar to app.vue outside to avoid it being rerendered on route change --- app.vue | 7 +++++++ layouts/client.vue | 7 ------- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/app.vue b/app.vue index c4fd0dc..850f19a 100644 --- a/app.vue +++ b/app.vue @@ -1,5 +1,12 @@