From 9fd39b949b0a985b4bf93c5537fb10e03cf547ed Mon Sep 17 00:00:00 2001 From: Darshan Date: Mon, 3 Feb 2025 18:01:02 +0530 Subject: [PATCH] update: feedback modal. --- src/lib/components/feedback/evaluation.svelte | 16 +++---- src/lib/components/feedback/feedback.svelte | 34 ++++++++------- .../feedback/feedbackGeneral.svelte | 8 ++-- .../components/feedback/feedbackNPS.svelte | 16 ++++--- src/lib/components/navbar.svelte | 4 +- src/lib/components/sidebar.svelte | 18 +++++--- src/lib/elements/forms/inputTextarea.svelte | 3 +- src/lib/stores/feedback.ts | 6 +-- .../feedback/mobileFeedbackModal.svelte | 43 +++++++++++++++++++ 9 files changed, 97 insertions(+), 51 deletions(-) create mode 100644 src/routes/(console)/wizard/feedback/mobileFeedbackModal.svelte diff --git a/src/lib/components/feedback/evaluation.svelte b/src/lib/components/feedback/evaluation.svelte index 1e770e900..893b300b2 100644 --- a/src/lib/components/feedback/evaluation.svelte +++ b/src/lib/components/feedback/evaluation.svelte @@ -1,4 +1,6 @@ @@ -7,21 +9,17 @@
    {#each Array(11) as _, i}
  1. - (value = i)} - type="radio" - name="recommend" - class="radio-button" - data-text={i} - checked={value === i} /> + (value = i)}> + {i} +
    2. {/each}
-
+
Not at all likely Extremely likely
diff --git a/src/lib/components/feedback/feedback.svelte b/src/lib/components/feedback/feedback.svelte index edc645bf0..bf4fd91c5 100644 --- a/src/lib/components/feedback/feedback.svelte +++ b/src/lib/components/feedback/feedback.svelte @@ -10,9 +10,12 @@ import { organization } from '$lib/stores/organization'; import { addNotification } from '$lib/stores/notifications'; import { page } from '$app/stores'; + import { Typography } from '@appwrite.io/pink-svelte'; $: $selectedFeedback = feedbackOptions.find((option) => option.type === $feedback.type); + export let isMobile: boolean = false; + async function submit() { try { await feedback.submitFeedback( @@ -39,26 +42,25 @@ } -
-
-

{$selectedFeedback.title}

- +
+
+ {#if !isMobile} + Feedback + {/if} + {#if $selectedFeedback.desc} + {$selectedFeedback.desc} + {/if}
-
- {$selectedFeedback.desc} -
-
+ +
diff --git a/src/lib/components/feedback/feedbackGeneral.svelte b/src/lib/components/feedback/feedbackGeneral.svelte index 642cbf6bb..896f58a03 100644 --- a/src/lib/components/feedback/feedbackGeneral.svelte +++ b/src/lib/components/feedback/feedbackGeneral.svelte @@ -5,9 +5,9 @@ + id="feedback" + bind:value={$feedbackData.message} + label="Tell us more about your experience" + placeholder="Share your suggestions and feature requests..." /> diff --git a/src/lib/components/feedback/feedbackNPS.svelte b/src/lib/components/feedback/feedbackNPS.svelte index 1560580f6..c548854db 100644 --- a/src/lib/components/feedback/feedbackNPS.svelte +++ b/src/lib/components/feedback/feedbackNPS.svelte @@ -1,20 +1,22 @@ - How likely are you to recommend Appwrite to a friend or colleague? + How likely are you to recommend Appwrite to a friend or colleague? {#if $feedbackData.value !== null} + + label="Tell us more about your experience (optional)" + placeholder="Share your suggestions and feature requests..." + helper="Need help? Join our Discord for community support" /> {/if} diff --git a/src/lib/components/navbar.svelte b/src/lib/components/navbar.svelte index 8e8ecc8f0..1099cec1f 100644 --- a/src/lib/components/navbar.svelte +++ b/src/lib/components/navbar.svelte @@ -95,8 +95,8 @@
- - + toggleFeedback()} >Feedback diff --git a/src/lib/components/sidebar.svelte b/src/lib/components/sidebar.svelte index 6f1f726b7..d9203df46 100644 --- a/src/lib/components/sidebar.svelte +++ b/src/lib/components/sidebar.svelte @@ -25,10 +25,10 @@ import { toggleCommandCenter } from '$lib/commandCenter/commandCenter.svelte'; import { feedback } from '$lib/stores/feedback'; import { DropList } from '$lib/components/index'; - import { Feedback } from '$lib/components/feedback'; import type { ComponentType } from 'svelte'; import { showSupportModal } from '$routes/(console)/wizard/support/store'; import MobileSupportModal from '$routes/(console)/wizard/support/mobileSupportModal.svelte'; + import MobileFeedbackModal from '$routes/(console)/wizard/feedback/mobileFeedbackModal.svelte'; type $$Props = HTMLElement & { state?: 'closed' | 'open' | 'icons'; @@ -53,6 +53,7 @@ function toggleFeedback() { feedback.toggleFeedback(); + if ($feedback.notification) { feedback.toggleNotification(); feedback.addVisualization(); @@ -176,12 +177,15 @@ {:else}
- - + toggleFeedback()} >Feedback - + @@ -221,15 +225,15 @@
- + toggleFeedback()} >Feedback - + ; }; export const feedbackOptions: FeedbackOption[] = [ { type: 'general', - title: 'Help us improve Appwrite', desc: 'Appwrite evolves with your input. Share your thoughts and help us improve Appwrite.', component: FeedbackGeneral }, { type: 'nps', - title: 'Help us improve Appwrite', - desc: 'Appwrite evolves with your input. Share your thoughts and help us improve Appwrite. If you would like to be contacted regarding your feedback, please share your contact details below.', component: FeedbackNps } ]; diff --git a/src/routes/(console)/wizard/feedback/mobileFeedbackModal.svelte b/src/routes/(console)/wizard/feedback/mobileFeedbackModal.svelte new file mode 100644 index 000000000..a196a1014 --- /dev/null +++ b/src/routes/(console)/wizard/feedback/mobileFeedbackModal.svelte @@ -0,0 +1,43 @@ + + + + +