From c5078398b5204399fb9a82c3a56f7a070e1b83c4 Mon Sep 17 00:00:00 2001 From: Ian Torres Date: Fri, 20 Jun 2025 15:36:57 -0400 Subject: [PATCH] Subscribe on dashboard and layout improved. --- components/Cards/ChannelChatCard.vue | 3 +- components/Charts/RequestTypesChart.vue | 2 +- components/Forms/SubscribeForm.vue | 17 +++++-- components/Lists/InstancesList.vue | 10 ++++ components/Lists/SubscriptionsList.vue | 51 +++++++++++++++++++++ components/Resources/Services/Channels.vue | 2 +- components/Resources/Services/Overview.vue | 15 ++---- components/Tables/ServicesTable.vue | 20 ++++++-- components/Tabs/ServicesTab.vue | 2 +- layouts/default.vue | 32 ++++++++++++- package.json | 2 + pages/services/[id]/[tab].vue | 10 ---- public/logo.png | Bin 0 -> 1455168 bytes stores/services.ts | 28 +---------- stores/subscriptions.ts | 29 ++++++++++++ yarn.lock | 14 +++++- 16 files changed, 176 insertions(+), 61 deletions(-) create mode 100644 components/Lists/InstancesList.vue create mode 100644 components/Lists/SubscriptionsList.vue create mode 100644 public/logo.png create mode 100644 stores/subscriptions.ts diff --git a/components/Cards/ChannelChatCard.vue b/components/Cards/ChannelChatCard.vue index 3a153da..aabaf75 100644 --- a/components/Cards/ChannelChatCard.vue +++ b/components/Cards/ChannelChatCard.vue @@ -21,6 +21,8 @@ import type {FormSubmitEvent} from "@nuxt/ui"; const props = defineProps<{ channel: string }>() const messages = ref([]) +const toast = useToast(); +const { t } = useI18n(); const { connect, close } = useSocket() const route = useRoute(); @@ -46,7 +48,6 @@ const submit = async (event: FormSubmitEvent) => { toast.add({title: t('forms.event', { name: "Published"}), color: 'success'}) console.log("Published ⤑ Response", response) - emit('success'); } catch (error) { toast.add({title: t('forms.event', { name: "Published ⤑ Exception"}), color: 'error'}) console.error("Published ⤑ Exception", error) diff --git a/components/Charts/RequestTypesChart.vue b/components/Charts/RequestTypesChart.vue index 7074ab1..e444b4b 100644 --- a/components/Charts/RequestTypesChart.vue +++ b/components/Charts/RequestTypesChart.vue @@ -127,7 +127,7 @@ const xFormatter = (i: number): string | number => `${chart_data.value[i].date}` y-label="Requests" :y-grid-line="true" :x-formatter="xFormatter" - :x-num-ticks="10" + :x-num-ticks="2" :y-num-ticks="10" :curve-type="CurveType.MonotoneX" :legend-position="LegendPosition.Top" diff --git a/components/Forms/SubscribeForm.vue b/components/Forms/SubscribeForm.vue index 2ebebcb..511f666 100644 --- a/components/Forms/SubscribeForm.vue +++ b/components/Forms/SubscribeForm.vue @@ -20,7 +20,7 @@ import type {FormSubmitEvent} from "@nuxt/ui"; const {t} = useI18n() -const emit = defineEmits(["success"]); +const emit = defineEmits(["chat_closed"]); const schema = z.object({ channel: z.string(), @@ -32,8 +32,7 @@ const state = reactive>({ channel: '', }) -const toast = useToast() -const route = useRoute() +const subscriptions = useSubscriptions(); const open_chat = ref(false); const channel_listen = ref(""); @@ -41,11 +40,23 @@ const channel_listen = ref(""); const submit = async (event: FormSubmitEvent) => { try { channel_listen.value = event.data.channel; + + subscriptions.subscriptions.push({ + name: event.data.channel, + }) + open_chat.value = true; } catch (error) { throw error; } } + +watch(open_chat, (next, old) => { + console.log(old, next); + if (old == true && next == false) { + emit("chat_closed"); + } +})