feat(settings): mark integrations as experimental

packages/ui/src/components/sections/integrations/IntegrationsPage.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import { Icon } from '@/components/icon/Icon';
 import { SettingsPageLayout } from '@/components/sections/shared/SettingsPageLayout';
 import { useI18n } from '@/lib/i18n';
 import { ThirdPartyIntegrationsSection } from './ThirdPartyIntegrationsSection';
@@ -20,6 +21,12 @@ export const IntegrationsPage: React.FC<IntegrationsPageProps> = ({
       description={t('settings.page.integrations.description')}
       showSaveStatus={false}
     >
+      <div className="flex items-start gap-2 rounded-lg border border-[var(--status-warning-border)] bg-[var(--status-warning-background)] p-3">
+        <Icon name="error-warning" className="mt-0.5 size-4 shrink-0 text-[var(--status-warning)]" />
+        <p className="typography-meta text-[var(--status-warning)]">
+          {t('settings.integrations.experimentalWarning')}
+        </p>
+      </div>
       <ThirdPartyIntegrationsSection
         divider={false}
         onOpenProviderSetup={onOpenProviderSetup}

packages/ui/src/components/views/SettingsView.tsx

@@ -928,7 +928,7 @@ export const SettingsView: React.FC<SettingsViewProps> = ({ onClose, forceMobile
                               : <Icon name={iconName!} className="h-[18px] w-[18px] shrink-0 sm:h-4 sm:w-4" />}
                             <span className="flex items-center gap-1.5 whitespace-nowrap overflow-hidden transition-opacity duration-150 opacity-100">
                               <span className="typography-ui-label font-normal truncate">{getPageTitle(page.slug)}</span>
-                              {page.slug === 'tunnel' && (
+                              {(page.slug === 'tunnel' || page.slug === 'integrations') && (
                                 <span className="shrink-0 typography-micro px-1 rounded leading-none pb-px text-[var(--status-warning)] bg-[var(--status-warning)]/10">
                                   {t('settings.view.badge.beta')}
                                 </span>