From f0ff06a8568381f769144bedba895a92ceafac53 Mon Sep 17 00:00:00 2001
From: Iniubong Obonguko <iniubongobonguko2018@gmail.com>
Date: Wed, 29 May 2024 00:23:36 +0100
Subject: [PATCH] fix: prevent hypen at start or end of organzation or domain
 name (#340)

* fix: adding hypen to start or end of org or domain name

* fix: add org name validation to settings page

* chore: remove unnecessary variable use

* chore: remove error reset function

* Update OrgSettings.svelte

---------

Co-authored-by: Rotimi Best <best@classroomio.com>
---
 .../Org/Settings/OrgSettings.svelte           | 22 +++++++++++++++++--
 .../src/lib/utils/functions/validator.js      | 22 +++++++++++++++++--
 2 files changed, 40 insertions(+), 4 deletions(-)

diff --git a/apps/dashboard/src/lib/components/Org/Settings/OrgSettings.svelte b/apps/dashboard/src/lib/components/Org/Settings/OrgSettings.svelte
index 27508058..e1c3a965 100644
--- a/apps/dashboard/src/lib/components/Org/Settings/OrgSettings.svelte
+++ b/apps/dashboard/src/lib/components/Org/Settings/OrgSettings.svelte
@@ -1,4 +1,4 @@
-<script>
+<script lang="ts">
   import { goto } from '$app/navigation';
   import { Grid, Row, Column } from 'carbon-components-svelte';
   import FlashFilled from 'carbon-icons-svelte/lib/FlashFilled.svelte';
@@ -12,8 +12,18 @@
   import SectionTitle from '../SectionTitle.svelte';
   import { t } from '$lib/utils/functions/translations';
   import { isFreePlan } from '$lib/utils/store/org';
+  import { updateOrgNameValidation } from '$lib/utils/functions/validator';
 
   let avatar;
+
+  type Error = {
+    orgName: string;
+  };
+
+  let errors: Error = {
+    orgName: ''
+  };
+
   let loading = false;
   const themes = {
     rose: 'theme-rose',
@@ -42,11 +52,18 @@
   }
 
   async function handleUpdate() {
+    errors = updateOrgNameValidation($currentOrg.name) as Error;
+
+    if (Object.values(errors).length) {
+      loading = false;
+      return;
+    }
+
     try {
       loading = true;
 
       const updates = {
-        name: $currentOrg.name
+        name: $currentOrg.name,
       };
 
       if (avatar) {
@@ -108,6 +125,7 @@
         label={$t('settings.organization.organization_profile.organization_name')}
         bind:value={$currentOrg.name}
         className="w-full lg:w-60 mb-5"
+        errorMessage={errors.orgName}
       />
       <UploadImage
         bind:avatar
diff --git a/apps/dashboard/src/lib/utils/functions/validator.js b/apps/dashboard/src/lib/utils/functions/validator.js
index af7f8a1d..fa464661 100644
--- a/apps/dashboard/src/lib/utils/functions/validator.js
+++ b/apps/dashboard/src/lib/utils/functions/validator.js
@@ -3,10 +3,20 @@ import z from 'zod';
 import { validateEmail } from './validateEmail';
 
 const getOrgNameValidation = () =>
-  z.string().min(5, { message: 'Organization must contain 5 or more characters' });
+  z
+    .string()
+    .min(5, { message: 'Organization must contain 5 or more characters' })
+    .refine((val) => !/^[-]|[-]$/.test(val), {
+      message: 'Organization name cannot start or end with a hyphen'
+    });
 
 const getSiteNameValidation = () =>
-  z.string().min(5, { message: 'Site name must contain 5 or more characters' });
+  z
+    .string()
+    .min(5, { message: 'Site name must contain 5 or more characters' })
+    .refine((val) => !/^[-]|[-]$/.test(val), {
+      message: 'Site name cannot start or end with a hyphen'
+    });
 
 const getNewsfeedValidation = () =>
   z.string().min(5, { message: 'Field must contain 5 or more characters' });
@@ -242,6 +252,14 @@ export const createOrgValidation = (fields = {}) => {
   return processErrors(error);
 };
 
+export const updateOrgNameValidation = (orgName) => {
+  const schema = z.object({
+    orgName: getOrgNameValidation()
+  });
+  const { error } = schema.safeParse({ orgName });
+
+  return processErrors(error);
+};
 export const updateOrgSiteNameValidation = (siteName) => {
   const schema = z.object({
     siteName: getSiteNameValidation()