[Page Layouts] - Add tabs (#14318)

This commit is contained in:
nitin
2025-09-06 14:57:37 +05:30
committed by GitHub
parent 821ae7c60d
commit ab9b5ca4c5
39 changed files with 1545 additions and 307 deletions
@@ -2,9 +2,10 @@ import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
import { FormTextFieldInput } from '@/object-record/record-field/ui/form-types/components/FormTextFieldInput';
import { useCreatePageLayoutIframeWidget } from '@/settings/page-layout/hooks/useCreatePageLayoutIframeWidget';
import { usePageLayoutWidgetUpdate } from '@/settings/page-layout/hooks/usePageLayoutWidgetUpdate';
import { pageLayoutDraftState } from '@/settings/page-layout/states/pageLayoutDraftState';
import { pageLayoutEditingWidgetIdState } from '@/settings/page-layout/states/pageLayoutEditingWidgetIdState';
import { pageLayoutWidgetsState } from '@/settings/page-layout/states/pageLayoutWidgetsState';
import styled from '@emotion/styled';
import { isString } from '@sniptt/guards';
import { useState } from 'react';
import { useRecoilState, useRecoilValue } from 'recoil';
import { isValidUrl } from 'twenty-shared/utils';
@@ -36,15 +37,17 @@ export const CommandMenuPageLayoutIframeConfig = () => {
const { handleUpdateWidget } = usePageLayoutWidgetUpdate();
const [pageLayoutEditingWidgetId, setPageLayoutEditingWidgetId] =
useRecoilState(pageLayoutEditingWidgetIdState);
const pageLayoutWidgets = useRecoilValue(pageLayoutWidgetsState);
const pageLayoutDraft = useRecoilValue(pageLayoutDraftState);
const editingWidget = pageLayoutWidgets.find(
const allWidgets = pageLayoutDraft.tabs.flatMap((tab) => tab.widgets);
const editingWidget = allWidgets.find(
(w) => w.id === pageLayoutEditingWidgetId,
);
const isEditMode = !!editingWidget;
const [title, setTitle] = useState(editingWidget?.title || '');
const [url, setUrl] = useState(editingWidget?.configuration?.url || '');
const configUrl = editingWidget?.configuration?.url;
const [url, setUrl] = useState(isString(configUrl) ? configUrl : '');
const [urlError, setUrlError] = useState('');
const validateUrl = (urlString: string): boolean => {