feat: add timezone constants and update forms to use new timezone data instead of javscript internationalization to get timezone data

frontend/src/constants/timezones.js

@@ -0,0 +1,36 @@
+export const timeZones = {
+    "UTC (UTC+00:00)": "UTC",
+    "New York, America (UTC-05:00)": "America/New_York",
+    "Chicago, America (UTC-06:00)": "America/Chicago",
+    "Denver, America (UTC-07:00)": "America/Denver",
+    "Los Angeles, America (UTC-08:00)": "America/Los_Angeles",
+    "Toronto, America (UTC-05:00)": "America/Toronto",
+    "Mexico City, America (UTC-06:00)": "America/Mexico_City",
+    "Bogotá, America (UTC-05:00)": "America/Bogota",
+    "São Paulo, America (UTC-03:00)": "America/Sao_Paulo",
+    "Buenos Aires, America (UTC-03:00)": "America/Buenos_Aires",
+    "Santiago, America (UTC-04:00)": "America/Santiago",
+    "London, Europe (UTC+00:00)": "Europe/London",
+    "Berlin, Europe (UTC+01:00)": "Europe/Berlin",
+    "Paris, Europe (UTC+01:00)": "Europe/Paris",
+    "Rome, Europe (UTC+01:00)": "Europe/Rome",
+    "Madrid, Europe (UTC+01:00)": "Europe/Madrid",
+    "Moscow, Europe (UTC+03:00)": "Europe/Moscow",
+    "Istanbul, Europe (UTC+03:00)": "Europe/Istanbul",
+    "Dubai, Asia (UTC+04:00)": "Asia/Dubai",
+    "Kolkata, Asia (UTC+05:30)": "Asia/Kolkata",
+    "Bangkok, Asia (UTC+07:00)": "Asia/Bangkok",
+    "Singapore, Asia (UTC+08:00)": "Asia/Singapore",
+    "Shanghai, Asia (UTC+08:00)": "Asia/Shanghai",
+    "Seoul, Asia (UTC+09:00)": "Asia/Seoul",
+    "Tokyo, Asia (UTC+09:00)": "Asia/Tokyo",
+    "Sydney, Australia (UTC+10:00)": "Australia/Sydney",
+    "Melbourne, Australia (UTC+10:00)": "Australia/Melbourne",
+    "Perth, Australia (UTC+08:00)": "Australia/Perth",
+    "Auckland, Pacific (UTC+12:00)": "Pacific/Auckland",
+    "Honolulu, Pacific (UTC-10:00)": "Pacific/Honolulu",
+    "Cairo, Africa (UTC+02:00)": "Africa/Cairo",
+    "Lagos, Africa (UTC+01:00)": "Africa/Lagos",
+    "Nairobi, Africa (UTC+03:00)": "Africa/Nairobi",
+    "Johannesburg, Africa (UTC+02:00)": "Africa/Johannesburg"
+}

frontend/src/features/admin/general/GeneralSettingForm.vue

@@ -41,14 +41,14 @@
             </SelectTrigger>
             <SelectContent>
               <SelectGroup>
-                <SelectItem v-for="timezone in timezones" :key="timezone" :value="timezone">
-                  {{ timezone }}
+                <SelectItem v-for="(value, label) in timeZones" :key="value" :value="value">
+                  {{ label }}
                 </SelectItem>
               </SelectGroup>
             </SelectContent>
           </Select>
         </FormControl>
-        <FormDescription>Default timezone.</FormDescription>
+        <FormDescription>Default timezone for your desk.</FormDescription>
         <FormMessage />
       </FormItem>
     </FormField>
@@ -70,7 +70,7 @@
             </SelectContent>
           </Select>
         </FormControl>
-        <FormDescription>Default business hours.</FormDescription>
+        <FormDescription>Default business hours for your desk.</FormDescription>
         <FormMessage />
       </FormItem>
     </FormField>
@@ -81,7 +81,7 @@
         <FormControl>
           <Input type="text" placeholder="Root URL" v-bind="field" />
         </FormControl>
-        <FormDescription>Root URL of the app.</FormDescription>
+        <FormDescription>Root URL of the app.(No trailing slash)</FormDescription>
         <FormMessage />
       </FormItem>
     </FormField>
@@ -123,27 +123,22 @@
       </FormItem>
     </FormField>
 
-  
-      <FormField name="allowed_file_upload_extensions" v-slot="{ componentField, handleChange }">
-        <FormItem>
-          <FormLabel>Allowed file upload extensions</FormLabel>
-          <FormControl>
-            <TagsInput
-              :modelValue="componentField.modelValue"
-              @update:modelValue="handleChange"
-            >
-              <TagsInputItem v-for="item in componentField.modelValue" :key="item" :value="item">
-                <TagsInputItemText />
-                <TagsInputItemDelete />
-              </TagsInputItem>
-              <TagsInputInput placeholder="jpg" />
-            </TagsInput>
-          </FormControl>
-          <FormDescription>Use `*` to allow any file.</FormDescription>
-          <FormMessage />
-        </FormItem>
-      </FormField>
-    
+    <FormField name="allowed_file_upload_extensions" v-slot="{ componentField, handleChange }">
+      <FormItem>
+        <FormLabel>Allowed file upload extensions</FormLabel>
+        <FormControl>
+          <TagsInput :modelValue="componentField.modelValue" @update:modelValue="handleChange">
+            <TagsInputItem v-for="item in componentField.modelValue" :key="item" :value="item">
+              <TagsInputItemText />
+              <TagsInputItemDelete />
+            </TagsInputItem>
+            <TagsInputInput placeholder="jpg" />
+          </TagsInput>
+        </FormControl>
+        <FormDescription>Use `*` to allow any file.</FormDescription>
+        <FormMessage />
+      </FormItem>
+    </FormField>
 
     <Button type="submit" :isLoading="formLoading"> {{ submitLabel }} </Button>
   </form>
@@ -182,10 +177,10 @@ import { Input } from '@/components/ui/input'
 import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
 import { useEmitter } from '@/composables/useEmitter'
 import { handleHTTPError } from '@/utils/http'
+import { timeZones } from '@/constants/timezones.js'
 import api from '@/api'
 
 const emitter = useEmitter()
-const timezones = Intl.supportedValuesOf('timeZone')
 const businessHours = ref({})
 const formLoading = ref(false)
 const props = defineProps({

frontend/src/features/admin/teams/TeamForm.vue

@@ -75,8 +75,8 @@
             </SelectTrigger>
             <SelectContent>
               <SelectGroup>
-                <SelectItem v-for="timezone in timezones" :key="timezone" :value="timezone">
-                  {{ timezone }}
+                <SelectItem v-for="(value, label) in timeZones" :key="value" :value="value">
+                  {{ label }}
                 </SelectItem>
               </SelectGroup>
             </SelectContent>
@@ -145,7 +145,7 @@
 </template>
 
 <script setup>
-import { ref, watch, computed, onMounted } from 'vue'
+import { ref, watch, onMounted } from 'vue'
 import { onClickOutside } from '@vueuse/core'
 import { Button } from '@/components/ui/button'
 import { useForm } from 'vee-validate'
@@ -174,14 +174,13 @@ import EmojiPicker from 'vue3-emoji-picker'
 import 'vue3-emoji-picker/css'
 import { handleHTTPError } from '@/utils/http'
 import { useSlaStore } from '@/stores/sla'
+import { timeZones } from '@/constants/timezones.js'
 import api from '@/api'
 
 const emitter = useEmitter()
 const slaStore = useSlaStore()
-const timezones = computed(() => Intl.supportedValuesOf('timeZone'))
 const assignmentTypes = ['Round robin', 'Manual']
 const businessHours = ref([])
-const slaPolicies = ref([])
 
 const props = defineProps({
   initialValues: { type: Object, required: false },