diff --git a/src/app/dashboard/(organisation)/[slug]/widget/components/SocialSignInPopup.tsx b/src/app/dashboard/(organisation)/[slug]/widget/components/SocialSignInPopup.tsx index cf0d3286..e622a5b9 100644 --- a/src/app/dashboard/(organisation)/[slug]/widget/components/SocialSignInPopup.tsx +++ b/src/app/dashboard/(organisation)/[slug]/widget/components/SocialSignInPopup.tsx @@ -36,7 +36,6 @@ function SocialSignInPopup({ socialName }: { socialName: string }) { const active = social[socialType] ? true : false; // const generic = !active ? false : (social[socialType]?.CLIENT_ID); const generic = !active ? false : !social[socialType].CLIENT_ID; - console.log(generic); const destructiveToast = () => { toast({ variant: 'destructive', diff --git a/src/app/dashboard/(organisation)/[slug]/widget/components/email-settings.tsx b/src/app/dashboard/(organisation)/[slug]/widget/components/email-settings.tsx index 5d786f57..cc461805 100644 --- a/src/app/dashboard/(organisation)/[slug]/widget/components/email-settings.tsx +++ b/src/app/dashboard/(organisation)/[slug]/widget/components/email-settings.tsx @@ -1,8 +1,27 @@ -import { useEffect } from 'react'; -import { useWidgetStore } from '../widgetStore'; +'use client'; +import { useEffect, useState } from 'react'; +import { useWidgetStore, updateStoreWithFetch } from '../widgetStore'; import { WidgetInput } from './widget-input'; - +import { Button } from '@/components/ui/Button'; +import { useAuth } from '@/Providers/AuthContext'; +import { OrgObject } from '../widgetStore'; +import { useToast } from '@/components/ui/use-toast'; +import Spinner from '@/components/spinner'; +import '@total-typescript/ts-reset'; +import { useParams } from 'next/navigation'; export function EmailSettings() { + const { slug: ORG_ID } = useParams(); + const { token } = useAuth(); + const { toast } = useToast(); + const destructiveToast = () => { + toast({ + variant: 'destructive', + title: 'Uh oh! Something went wrong.', + description: 'There was a problem with your request.' + }); + }; + const [isLoading, setIsLoading] = useState(false); + const { smtpProvider, smtpPort, @@ -14,6 +33,48 @@ export function EmailSettings() { setPassword } = useWidgetStore(); + const emailObj = { + email_provider: { + smtp: { + password: password, + username: userOrEmail, + smtp_server: smtpProvider, + smtp_port: smtpPort + } + } + }; + async function handleSave() { + setIsLoading(true); + try { + // console.log(JSON.stringify(widgetObj)); + const res = await fetch(`https://api.trustauthx.com/org/${ORG_ID}`, { + method: 'PUT', + headers: { + accept: 'application/json', + 'Content-Type': 'application/json', + Authorization: `Bearer ${token}` + }, + body: JSON.stringify(emailObj) + }); + + if (res.status === 200) { + setIsLoading(false); + toast({ + title: 'Success!', + description: 'Your settings have been saved successfully', + variant: 'success' + }); + if (token) await updateStoreWithFetch(token, ORG_ID); + } else { + setIsLoading(false); + destructiveToast(); + } + } catch (err) { + console.log(err); + setIsLoading(false); + destructiveToast(); + } + } return (
+
); } diff --git a/src/app/dashboard/(organisation)/[slug]/widget/components/widget-footer.tsx b/src/app/dashboard/(organisation)/[slug]/widget/components/widget-footer.tsx index a1d37ea0..af818716 100644 --- a/src/app/dashboard/(organisation)/[slug]/widget/components/widget-footer.tsx +++ b/src/app/dashboard/(organisation)/[slug]/widget/components/widget-footer.tsx @@ -14,9 +14,6 @@ type FooterProps = { reset: () => void; }; -// const ORG_ID = -// '73bbc4bf458a4f66acab0a8cfefa47d13aa33402120d11ee88069dc8f7663e88'; - // TODO: Update server state on clicking save // Object to update server state / push // Logo string defaults to "" @@ -71,7 +68,7 @@ export function WidgetFooter({ reset }: FooterProps) { const widgetObj: OrgObject = { name: displayName, host: hostURL, - social: social, + // social: social, widget: { name: displayName, logo_url: s3ImageUrl, @@ -103,28 +100,13 @@ export function WidgetFooter({ reset }: FooterProps) { color9: color9.hex, color10: nameFontColor.hex, color11: greetingFontColor.hex - }, - email_provider: { - smtp: { - smtp_server: smtpProvider, - smtp_port: smtpPort, - username: userOrEmail, - password: password - } } }; - // smtpProvider, - // smtpPort, - // userOrEmail, - // password, + if (callbackURL) widgetObj.callback_url = callbackURL; if (redirectURL) widgetObj.widget.redirect_url = redirectURL; if (tncURL) widgetObj.tnc_url = tncURL; if (ppURL) widgetObj.pp_url = ppURL; - // if(smtpProvider) widgetObj.email_provider.smtp.smtp_server = smtpProvider; - // if(smtpPort) widgetObj.email_provider.smtp.smtp_port = smtpPort; - // if(userOrEmail) widgetObj.email_provider.smtp.username = userOrEmail; - // if(password) widgetObj.email_provider.smtp.password = password; // if (smtpPort) const destructiveToast = () => { diff --git a/src/app/dashboard/(organisation)/[slug]/widget/widgetStore.ts b/src/app/dashboard/(organisation)/[slug]/widget/widgetStore.ts index 92f22e88..ad972ff3 100644 --- a/src/app/dashboard/(organisation)/[slug]/widget/widgetStore.ts +++ b/src/app/dashboard/(organisation)/[slug]/widget/widgetStore.ts @@ -50,16 +50,16 @@ export type OrgObject = { color11: string; redirect_url?: string; }; - email_provider: { + email_provider?: { smtp: { - password: string | undefined; - username: string | undefined; - smtp_server: string | undefined; + password?: string | undefined; + username?: string | undefined; + smtp_server?: string | undefined; smtp_port?: string | undefined; }; }; callback_url?: string; - social: Social; + social?: Social; tnc_url?: string; pp_url?: string; };