feat: Allow detaching help center widget (#12459)

## Summary
- allow help center portals to clear their associated web widget


Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>

app/javascript/dashboard/components-next/HelpCenter/Pages/PortalSettingsPage/PortalBaseSettings.vue

@@ -51,12 +51,20 @@ const originalState = reactive({ ...state });
 
 const liveChatWidgets = computed(() => {
   const inboxes = store.getters['inboxes/getInboxes'];
-  return inboxes
+  const widgetOptions = inboxes
     .filter(inbox => inbox.channel_type === 'Channel::WebWidget')
     .map(inbox => ({
       value: inbox.id,
       label: inbox.name,
     }));
+
+  return [
+    {
+      value: '',
+      label: t('HELP_CENTER.PORTAL_SETTINGS.FORM.LIVE_CHAT_WIDGET.NONE_OPTION'),
+    },
+    ...widgetOptions,
+  ];
 });
 
 const rules = {
@@ -108,7 +116,7 @@ watch(
         widgetColor: newVal.color,
         homePageLink: newVal.homepage_link,
         slug: newVal.slug,
-        liveChatWidgetInboxId: newVal.inbox?.id,
+        liveChatWidgetInboxId: newVal.inbox?.id || '',
       });
       if (newVal.logo) {
         const {

app/javascript/dashboard/i18n/locale/en/helpCenter.json

@@ -741,7 +741,8 @@
         "LIVE_CHAT_WIDGET": {
           "LABEL": "Live chat widget",
           "PLACEHOLDER": "Select live chat widget",
-          "HELP_TEXT": "Select a live chat widget that will appear on your help center"
+          "HELP_TEXT": "Select a live chat widget that will appear on your help center",
+          "NONE_OPTION": "No widget"
         },
         "BRAND_COLOR": {
           "LABEL": "Brand color"