diff --git a/ui/src/components/BaseFormView/BaseFormView.tsx b/ui/src/components/BaseFormView/BaseFormView.tsx index 36f1b34ee..b5189c01e 100644 --- a/ui/src/components/BaseFormView/BaseFormView.tsx +++ b/ui/src/components/BaseFormView/BaseFormView.tsx @@ -44,7 +44,7 @@ import { ChangeRecord, CustomHookClass, EntitiesAllowingModifications, -} from './BaseFormTypes'; +} from '../../types/components/BaseFormTypes'; import { getAllFieldsWithModifications, getModifiedState, diff --git a/ui/src/components/BaseFormView/stories/BaseFormView.stories.tsx b/ui/src/components/BaseFormView/stories/BaseFormView.stories.tsx index 0e36fe6d7..5fdb655cb 100644 --- a/ui/src/components/BaseFormView/stories/BaseFormView.stories.tsx +++ b/ui/src/components/BaseFormView/stories/BaseFormView.stories.tsx @@ -10,7 +10,7 @@ import { import { setUnifiedConfig } from '../../../util/util'; import { GlobalConfig } from '../../../types/globalConfig/globalConfig'; import { Mode } from '../../../constants/modes'; -import { BaseFormProps } from '../BaseFormTypes'; +import { BaseFormProps } from '../../../types/components/BaseFormTypes'; import { Platforms } from '../../../types/globalConfig/pages'; import { getGlobalConfigMockGroupsFoInputPage, diff --git a/ui/src/components/ControlWrapper/ControlWrapper.tsx b/ui/src/components/ControlWrapper/ControlWrapper.tsx index 4fc0c0cde..6719b6625 100644 --- a/ui/src/components/ControlWrapper/ControlWrapper.tsx +++ b/ui/src/components/ControlWrapper/ControlWrapper.tsx @@ -3,7 +3,7 @@ import ControlGroup from '@splunk/react-ui/ControlGroup'; import styled from 'styled-components'; import MarkdownMessage from '../MarkdownMessage/MarkdownMessage'; import CONTROL_TYPE_MAP, { ComponentTypes } from '../../constants/ControlTypeMap'; -import { AnyEntity, UtilControlWrapper } from '../BaseFormView/BaseFormTypes'; +import { AnyEntity, UtilControlWrapper } from '../../types/components/BaseFormTypes'; import { AcceptableFormValueOrNullish } from '../../types/components/shareableTypes'; import CustomControl from '../CustomControl/CustomControl'; import { Mode } from '../../constants/modes'; diff --git a/ui/src/components/CustomControl/CustomControl.tsx b/ui/src/components/CustomControl/CustomControl.tsx index f2fab8bb0..810c7cb63 100644 --- a/ui/src/components/CustomControl/CustomControl.tsx +++ b/ui/src/components/CustomControl/CustomControl.tsx @@ -3,7 +3,7 @@ import { _ } from '@splunk/ui-utils/i18n'; import { getUnifiedConfigs } from '../../util/util'; import { getBuildDirPath } from '../../util/script'; import { AcceptableFormValueOrNullish } from '../../types/components/shareableTypes'; -import { UtilBaseForm } from '../BaseFormView/BaseFormTypes'; +import { UtilBaseForm } from '../../types/components/BaseFormTypes'; import { GlobalConfig } from '../../types/globalConfig/globalConfig'; import { Mode } from '../../constants/modes'; diff --git a/ui/src/components/CustomControl/CustomControlMockForTest.ts b/ui/src/components/CustomControl/CustomControlMockForTest.ts index 014093379..aea85a060 100644 --- a/ui/src/components/CustomControl/CustomControlMockForTest.ts +++ b/ui/src/components/CustomControl/CustomControlMockForTest.ts @@ -1,7 +1,7 @@ import { Mode } from '../../constants/modes'; import { AcceptableFormValueOrNullish } from '../../types/components/shareableTypes'; import { GlobalConfig } from '../../types/globalConfig/globalConfig'; -import { UtilControlWrapper } from '../BaseFormView/BaseFormTypes'; +import { UtilControlWrapper } from '../../types/components/BaseFormTypes'; export class CustomControlMockForTest { globalConfig: GlobalConfig; diff --git a/ui/src/components/FormModifications/FormModifications.test.tsx b/ui/src/components/FormModifications/FormModifications.test.tsx index de89ebb5d..5a0f21d12 100644 --- a/ui/src/components/FormModifications/FormModifications.test.tsx +++ b/ui/src/components/FormModifications/FormModifications.test.tsx @@ -11,7 +11,7 @@ import { thirdModificationField, } from './TestConfig'; import EntityModal, { EntityModalProps } from '../EntityModal/EntityModal'; -import { EntitiesAllowingModifications } from '../BaseFormView/BaseFormTypes'; +import { EntitiesAllowingModifications } from '../../types/components/BaseFormTypes'; import { invariant } from '../../util/invariant'; const handleRequestClose = jest.fn(); diff --git a/ui/src/components/FormModifications/FormModifications.ts b/ui/src/components/FormModifications/FormModifications.ts index 67117f43d..bace50eaf 100644 --- a/ui/src/components/FormModifications/FormModifications.ts +++ b/ui/src/components/FormModifications/FormModifications.ts @@ -5,7 +5,7 @@ import { BaseFormState, AnyEntity, EntitiesAllowingModifications, -} from '../BaseFormView/BaseFormTypes'; +} from '../../types/components/BaseFormTypes'; import { MarkdownMessageProps } from '../MarkdownMessage/MarkdownMessage'; const VALUE_TO_TRIGGER_UPDATE_FOR_ANY_NOT_LISTED_VALUES = '[[any_other_value]]'; diff --git a/ui/src/components/table/CustomTable.tsx b/ui/src/components/table/CustomTable.tsx index 46cb62390..5ac928783 100644 --- a/ui/src/components/table/CustomTable.tsx +++ b/ui/src/components/table/CustomTable.tsx @@ -76,7 +76,7 @@ const CustomTable: React.FC = ({ : undefined; const { moreInfo, header: headers, actions } = tableConfig; - const headerMapping: Record = {}; + const headerMapping: Record | undefined> = {}; headers.forEach((x) => { headerMapping[x.field] = x.mapping; diff --git a/ui/src/components/table/CustomTableRow.jsx b/ui/src/components/table/CustomTableRow.tsx similarity index 77% rename from ui/src/components/table/CustomTableRow.jsx rename to ui/src/components/table/CustomTableRow.tsx index 5ed7a8ea6..bc4511485 100644 --- a/ui/src/components/table/CustomTableRow.jsx +++ b/ui/src/components/table/CustomTableRow.tsx @@ -1,5 +1,4 @@ -import React, { useCallback } from 'react'; -import PropTypes from 'prop-types'; +import React, { ReactElement, useCallback } from 'react'; import WaitSpinner from '@splunk/react-ui/WaitSpinner'; import Switch from '@splunk/react-ui/Switch'; @@ -16,6 +15,7 @@ import { _ } from '@splunk/ui-utils/i18n'; import CustomTableControl from './CustomTableControl'; import { ActionButtonComponent } from './CustomTableStyle'; import { getTableCellValue } from './table.utils'; +import { RowDataFields } from '../../context/TableContext'; const TableCellWrapper = styled(Table.Cell)` padding: 2px; @@ -30,7 +30,24 @@ const SwitchWrapper = styled.div` } `; -function CustomTableRow(props) { +interface CustomTableRowProps { + row: RowDataFields; + readonly?: boolean; + columns: Array<{ customCell?: { src?: string; type?: string }; field: string }>; + rowActions: string[]; + headerMapping: Record | undefined>; + handleToggleActionClick: (row: RowDataFields) => void; + handleEditActionClick: (row: RowDataFields) => void; + handleCloneActionClick: (row: RowDataFields) => void; + handleDeleteActionClick: (row: RowDataFields) => void; +} + +interface CellHeader { + field: string; + customCell?: { src?: string; type?: string }; +} + +function CustomTableRow(props: CustomTableRowProps) { const { row, columns, @@ -42,7 +59,9 @@ function CustomTableRow(props) { handleDeleteActionClick, } = props; - const getCustomCell = (customRow, header) => + const getCustomCell = (customRow: RowDataFields, header: CellHeader) => + header.customCell?.src && + header.customCell?.type && React.createElement(CustomTableControl, { serviceName: row.serviceName, field: header.field, @@ -52,7 +71,7 @@ function CustomTableRow(props) { }); const rowActionsPrimaryButton = useCallback( - (selectedRow, header) => ( + (selectedRow: RowDataFields, header: CellHeader) => ( {!props.readonly && rowActions.includes('edit') && ( @@ -60,7 +79,7 @@ function CustomTableRow(props) { } + icon={} onClick={() => handleEditActionClick(selectedRow)} className="editBtn" /> @@ -71,7 +90,7 @@ function CustomTableRow(props) { } + icon={} onClick={() => handleCloneActionClick(selectedRow)} className="cloneBtn" /> @@ -84,8 +103,11 @@ function CustomTableRow(props) { )} > } + icon={} to={`/app/search/search?q=search%20index%3D_internal%20source%3D*${selectedRow.name}*`} className="searchBtn" inline={false} @@ -98,7 +120,7 @@ function CustomTableRow(props) { } + icon={} onClick={() => handleDeleteActionClick(selectedRow)} className="deleteBtn" /> @@ -111,15 +133,12 @@ function CustomTableRow(props) { [handleEditActionClick, handleCloneActionClick, handleDeleteActionClick] ); - let statusContent = 'Active'; + let statusContent: string | ReactElement = row.disabled ? 'Inactive' : 'Active'; // eslint-disable-next-line no-underscore-dangle if (row.__toggleShowSpinner) { statusContent = ; - } else if (row.disabled) { - statusContent = - headerMapping?.disabled && headerMapping.disabled[row.disabled] - ? headerMapping.disabled[row.disabled] - : 'Inactive'; + } else if (headerMapping.disabled?.[String(row.disabled)]) { + statusContent = headerMapping.disabled[String(row.disabled)]; } // Fix set of props are passed to Table.Row element @@ -127,15 +146,16 @@ function CustomTableRow(props) { {columns && columns.length && columns.map((header) => { - let cellHTML = ''; + let cellHTML: string | ReactElement = ''; if (header.customCell && header.customCell.src) { cellHTML = ( - {getCustomCell(row, header)} + {header.customCell && getCustomCell(row, header)} ); } else if (header.field === 'disabled') { @@ -147,8 +167,10 @@ function CustomTableRow(props) { value={row.disabled} onClick={() => handleToggleActionClick(row)} selected={!row.disabled} - // eslint-disable-next-line no-underscore-dangle - disabled={row.__toggleShowSpinner || props.readonly} + disabled={ + // eslint-disable-next-line no-underscore-dangle + Boolean(row.__toggleShowSpinner) || props.readonly + } appearance="toggle" className="toggle_switch" selectedLabel={_( @@ -185,16 +207,4 @@ function CustomTableRow(props) { ); } -CustomTableRow.propTypes = { - row: PropTypes.any, - readonly: PropTypes.bool, - columns: PropTypes.array, - rowActions: PropTypes.array, - headerMapping: PropTypes.object, - handleToggleActionClick: PropTypes.func, - handleEditActionClick: PropTypes.func, - handleCloneActionClick: PropTypes.func, - handleDeleteActionClick: PropTypes.func, -}; - export default React.memo(CustomTableRow); diff --git a/ui/src/components/table/stories/TableWrapper.stories.tsx b/ui/src/components/table/stories/TableWrapper.stories.tsx index ca637108d..b942c5419 100644 --- a/ui/src/components/table/stories/TableWrapper.stories.tsx +++ b/ui/src/components/table/stories/TableWrapper.stories.tsx @@ -5,7 +5,11 @@ import { fn } from '@storybook/test'; import { setUnifiedConfig } from '../../../util/util'; import { GlobalConfig } from '../../../types/globalConfig/globalConfig'; import TableWrapper, { ITableWrapperProps } from '../TableWrapper'; -import { getSimpleConfig } from './configMockups'; +import { + getSimpleConfig, + getSimpleConfigStylePage, + getSimpleConfigWithMapping, +} from './configMockups'; import { TableContextProvider } from '../../../context/TableContext'; import { ServerHandlers } from './rowDataMockup'; @@ -43,3 +47,35 @@ export const OuathBasic: Story = { }, }, }; + +export const SimpleTableStylePage: Story = { + args: { + page: 'inputs', + serviceName: 'example_input_one', + handleRequestModalOpen: fn(), + handleOpenPageStyleDialog: fn(), + displayActionBtnAllRows: false, + config: getSimpleConfigStylePage() as GlobalConfig, + }, + parameters: { + msw: { + handlers: ServerHandlers, + }, + }, +}; + +export const SimpleConfigWithStatusMapped: Story = { + args: { + page: 'configuration', + serviceName: 'account', + handleRequestModalOpen: fn(), + handleOpenPageStyleDialog: fn(), + displayActionBtnAllRows: false, + config: getSimpleConfigWithMapping() as GlobalConfig, + }, + parameters: { + msw: { + handlers: ServerHandlers, + }, + }, +}; diff --git a/ui/src/components/table/stories/__images__/TableWrapper-simple-config-with-status-mapped-chromium.png b/ui/src/components/table/stories/__images__/TableWrapper-simple-config-with-status-mapped-chromium.png new file mode 100644 index 000000000..4bd5994dc --- /dev/null +++ b/ui/src/components/table/stories/__images__/TableWrapper-simple-config-with-status-mapped-chromium.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:c6b17039340782e2df7bad9f5c5c7f982c4622f7543e4a310985cb4d48a8238a +size 53330 diff --git a/ui/src/components/table/stories/__images__/TableWrapper-simple-table-style-page-chromium.png b/ui/src/components/table/stories/__images__/TableWrapper-simple-table-style-page-chromium.png new file mode 100644 index 000000000..395cd71e0 --- /dev/null +++ b/ui/src/components/table/stories/__images__/TableWrapper-simple-table-style-page-chromium.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:27fb19e29c6a81b6fb472fc5a733c523584efb42170ff491a3bac9b401f6211d +size 47044 diff --git a/ui/src/components/table/stories/configMockups.ts b/ui/src/components/table/stories/configMockups.ts index 50112490a..f92c8a354 100644 --- a/ui/src/components/table/stories/configMockups.ts +++ b/ui/src/components/table/stories/configMockups.ts @@ -139,6 +139,14 @@ export const TABLE_CONFIG_WITH_MAPPING = { abcd: 'z=abcd', }, }, + { + field: 'disabled', + label: 'Field Status', + mapping: { + false: 'Enabled Field', + true: 'Disabled Field', + }, + }, ], }, entity: [ @@ -242,3 +250,129 @@ export const TABLE_CONFIG_WITH_MAPPING = { schemaVersion: '0.0.3', }, } satisfies GlobalConfig; + +export const getSimpleConfigWithMapping = () => { + const configCp = JSON.parse(JSON.stringify(TABLE_CONFIG_WITH_MAPPING)); + return configCp; +}; + +export const SIMPLE_TABLE_MOCK_DATA_STYLE_PAGE = { + pages: { + configuration: { + tabs: [ + { + name: 'account', + table: { + actions: ['edit', 'delete', 'clone'], + header: [ + { + label: 'Name', + field: 'name', + }, + ], + }, + entity: [ + { + type: 'text', + label: 'Name', + validators: [ + { + type: 'string', + errorMsg: 'Length of ID should be between 1 and 50', + minLength: 1, + maxLength: 50, + }, + { + type: 'regex', + errorMsg: + 'Name must begin with a letter and consist exclusively of alphanumeric characters and underscores.', + pattern: '^[a-zA-Z]\\w*$', + }, + ], + field: 'name', + help: 'Enter a unique name for this account.', + required: true, + }, + ], + title: 'Account', + restHandlerModule: 'splunk_ta_uccexample_validate_account_rh', + restHandlerClass: 'CustomAccountValidator', + }, + ], + title: 'Configuration', + description: 'Set up your add-on', + }, + inputs: { + services: [ + { + name: 'example_input_one', + entity: [ + { + type: 'text', + label: 'Name', + validators: [ + { + type: 'regex', + errorMsg: + 'Input Name must begin with a letter and consist exclusively of alphanumeric characters and underscores.', + pattern: '^[a-zA-Z]\\w*$', + }, + { + type: 'string', + errorMsg: 'Length of input name should be between 1 and 100', + minLength: 1, + maxLength: 100, + }, + ], + field: 'name', + help: 'A unique name for the data input.', + required: true, + }, + { + type: 'checkbox', + label: 'Example Checkbox', + field: 'input_one_checkbox', + help: 'This is an example checkbox for the input one entity', + defaultValue: true, + }, + ], + title: 'Example Input One', + style: 'page', + }, + ], + title: 'Inputs', + description: 'Manage your data inputs', + table: { + actions: ['edit', 'delete', 'search', 'clone'], + header: [ + { + label: 'Name', + field: 'name', + }, + { + label: 'Input Status', + field: 'disabled', + }, + ], + moreInfo: [ + { + label: 'Name', + field: 'name', + }, + ], + }, + }, + }, + meta: { + name: 'Splunk_TA_UCCExample', + restRoot: 'splunk_ta_uccexample', + version: '5.41.0R9c5fbfe0', + displayName: 'Splunk UCC test Add-on', + schemaVersion: '0.0.3', + }, +} satisfies GlobalConfig; + +export const getSimpleConfigStylePage = () => { + const configCp = JSON.parse(JSON.stringify(SIMPLE_TABLE_MOCK_DATA_STYLE_PAGE)); + return configCp; +}; diff --git a/ui/src/components/table/stories/rowDataMockup.ts b/ui/src/components/table/stories/rowDataMockup.ts index 0a398aa9d..f36b58b08 100644 --- a/ui/src/components/table/stories/rowDataMockup.ts +++ b/ui/src/components/table/stories/rowDataMockup.ts @@ -338,7 +338,7 @@ export const ROW_DATA = [ account_radio: '1', auth_type: 'basic', custom_endpoint: 'login.example.com', - disabled: false, + disabled: true, 'eai:acl': null, 'eai:appName': 'Splunk_TA_UCCExample', 'eai:userName': 'nobody', @@ -382,7 +382,7 @@ export const ROW_DATA = [ account_radio: '1', auth_type: 'basic', custom_endpoint: 'login.example.com', - disabled: false, + disabled: true, 'eai:acl': null, 'eai:appName': 'Splunk_TA_UCCExample', 'eai:userName': 'nobody', @@ -407,4 +407,7 @@ export const ServerHandlers = [ http.get(`/servicesNS/nobody/-/splunk_ta_uccexample_account`, () => HttpResponse.json(MockRowData) ), + http.get('/servicesNS/nobody/-/splunk_ta_uccexample_example_input_one', () => + HttpResponse.json(MockRowData) + ), ]; diff --git a/ui/src/components/table/table.utils.ts b/ui/src/components/table/table.utils.ts index ea0b1633f..e94ff837b 100644 --- a/ui/src/components/table/table.utils.ts +++ b/ui/src/components/table/table.utils.ts @@ -9,7 +9,7 @@ export function isReadonlyRow(readonlyFieldId: string | undefined, row: Acceptab export function getTableCellValue( row: AcceptableFormRecord, field: string, - mapping: Record + mapping?: Record ) { const value = row[field]; const valueIsEmpty = value === null || value === undefined || value === ''; diff --git a/ui/src/components/table/tests/CustomTableRow.test.tsx b/ui/src/components/table/tests/CustomTableRow.test.tsx new file mode 100644 index 000000000..102e279f8 --- /dev/null +++ b/ui/src/components/table/tests/CustomTableRow.test.tsx @@ -0,0 +1,85 @@ +import { render, screen, within } from '@testing-library/react'; +import React from 'react'; + +import { BrowserRouter } from 'react-router-dom'; +import { http, HttpResponse } from 'msw'; +import { TableContextProvider } from '../../../context/TableContext'; +import { server } from '../../../mocks/server'; +import { setUnifiedConfig } from '../../../util/util'; +import { MockRowData } from '../stories/rowDataMockup'; +import TableWrapper, { ITableWrapperProps } from '../TableWrapper'; +import { getSimpleConfigStylePage } from '../stories/configMockups'; + +const handleRequestModalOpen = jest.fn(); +const handleOpenPageStyleDialog = jest.fn(); + +beforeEach(() => { + const props = { + page: 'inputs', + serviceName: 'example_input_one', + handleRequestModalOpen, + handleOpenPageStyleDialog, + displayActionBtnAllRows: false, + } satisfies ITableWrapperProps; + + server.use( + http.get('/servicesNS/nobody/-/splunk_ta_uccexample_example_input_one', () => + HttpResponse.json(MockRowData) + ) + ); + + setUnifiedConfig(getSimpleConfigStylePage()); + + render( + + + , + { wrapper: BrowserRouter } + ); +}); + +it('Render action icons correctly', async () => { + const allEditButtons = await screen.findAllByRole('button', { name: /edit/i }); + expect(allEditButtons).toHaveLength(9); + const allDeleteBtns = screen.getAllByRole('button', { name: /delete/i }); + expect(allDeleteBtns).toHaveLength(9); + const allCloneButtons = screen.getAllByRole('button', { name: /clone/i }); + expect(allCloneButtons).toHaveLength(9); + const allSearchButtons = screen.getAllByRole('link', { + name: /Go to search for events associated with/i, + }); + expect(allSearchButtons).toHaveLength(9); +}); + +it('Correctly call action handlers for page dialog', async () => { + (await screen.findAllByRole('button', { name: /edit/i }))[0].click(); + + expect(handleOpenPageStyleDialog).toHaveBeenCalledWith(expect.objectContaining({}), 'edit'); + + screen.getAllByRole('button', { name: /clone/i })[0].click(); + + expect(handleOpenPageStyleDialog).toHaveBeenNthCalledWith( + 2, + expect.objectContaining({}), + 'clone' + ); +}); + +it('Correctly render modal for delete action click', async () => { + // Clicking delete renders modal + (await screen.findAllByRole('button', { name: /delete/i }))[0].click(); + + expect(await screen.findByRole('dialog')).toHaveTextContent('Delete Confirmation'); +}); + +it('Correctly render status labels with default values', async () => { + const active = MockRowData.entry.find((entry) => entry.content.disabled === false); + const activeRow = await screen.findByLabelText(`row-${active?.name}`); + const statusCell = within(activeRow).getByTestId('status'); + expect(statusCell).toHaveTextContent('Active'); + + const inactive = MockRowData.entry.find((entry) => entry.content.disabled === true); + const inactiveRow = await screen.findByLabelText(`row-${inactive?.name}`); + const inactiveStatusCell = within(inactiveRow).getByTestId('status'); + expect(inactiveStatusCell).toHaveTextContent('Inactive'); +}); diff --git a/ui/src/components/table/tests/TableWrapper.test.tsx b/ui/src/components/table/tests/TableWrapper.test.tsx index f2c112e33..df1d27445 100644 --- a/ui/src/components/table/tests/TableWrapper.test.tsx +++ b/ui/src/components/table/tests/TableWrapper.test.tsx @@ -1,4 +1,4 @@ -import { render, screen } from '@testing-library/react'; +import { render, screen, within } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; import React from 'react'; import { http, HttpResponse } from 'msw'; @@ -8,7 +8,7 @@ import TableWrapper, { ITableWrapperProps } from '../TableWrapper'; import { server } from '../../../mocks/server'; import { TableContextProvider } from '../../../context/TableContext'; import { setUnifiedConfig } from '../../../util/util'; -import { SIMPLE_NAME_TABLE_MOCK_DATA, TABLE_CONFIG_WITH_MAPPING } from '../stories/configMockups'; +import { getSimpleConfigWithMapping, SIMPLE_NAME_TABLE_MOCK_DATA } from '../stories/configMockups'; jest.mock('immutability-helper'); @@ -79,7 +79,7 @@ it('sort items after filtering', async () => { ) ); - setUnifiedConfig(TABLE_CONFIG_WITH_MAPPING); + setUnifiedConfig(getSimpleConfigWithMapping()); render( @@ -148,3 +148,38 @@ it('sort items after filtering', async () => { ] `); }); + +it('Correctly render status labels with mapped values', async () => { + const props = { + page: 'configuration', + serviceName: 'account', + handleRequestModalOpen, + handleOpenPageStyleDialog, + displayActionBtnAllRows: false, + } satisfies ITableWrapperProps; + + server.use( + http.get('/servicesNS/nobody/-/splunk_ta_uccexample_account', () => + HttpResponse.json(MockRowData) + ) + ); + + setUnifiedConfig(getSimpleConfigWithMapping()); + + render( + + + , + { wrapper: BrowserRouter } + ); + + const active = MockRowData.entry.find((entry) => entry.content.disabled === false); + const activeRow = await screen.findByLabelText(`row-${active?.name}`); + const statusCell = within(activeRow).getByTestId('status'); + expect(statusCell).toHaveTextContent('Enabled Field'); + + const inactive = MockRowData.entry.find((entry) => entry.content.disabled === true); + const inActiveRow = await screen.findByLabelText(`row-${inactive?.name}`); + const inActiveStatusCell = within(inActiveRow).getByTestId('status'); + expect(inActiveStatusCell).toHaveTextContent('Disabled Field'); +}); diff --git a/ui/src/hooks/usePlatform.ts b/ui/src/hooks/usePlatform.ts index 40954830f..16fa55c9f 100644 --- a/ui/src/hooks/usePlatform.ts +++ b/ui/src/hooks/usePlatform.ts @@ -4,7 +4,7 @@ import SearchJob from '@splunk/search-job'; import { Platforms } from '../types/globalConfig/pages'; import { GlobalConfig } from '../types/globalConfig/globalConfig'; import { StandardPages } from '../types/components/shareableTypes'; -import { AnyEntity } from '../components/BaseFormView/BaseFormTypes'; +import { AnyEntity } from '../types/components/BaseFormTypes'; const checkIfHideInAnyEntity = (entities: AnyEntity[]): boolean => { const isUsed = entities.find((entity) => { diff --git a/ui/src/components/BaseFormView/BaseFormTypes.ts b/ui/src/types/components/BaseFormTypes.ts similarity index 95% rename from ui/src/components/BaseFormView/BaseFormTypes.ts rename to ui/src/types/components/BaseFormTypes.ts index 7b75a4638..f12af7687 100644 --- a/ui/src/components/BaseFormView/BaseFormTypes.ts +++ b/ui/src/types/components/BaseFormTypes.ts @@ -4,8 +4,8 @@ import { AcceptableFormValueOrNull, AcceptableFormValueOrNullish, StandardPages, -} from '../../types/components/shareableTypes'; -import { MarkdownMessageProps } from '../MarkdownMessage/MarkdownMessage'; +} from './shareableTypes'; +import { MarkdownMessageProps } from '../../components/MarkdownMessage/MarkdownMessage'; import { AnyOfEntity, CheckboxEntity, @@ -16,8 +16,8 @@ import { SingleSelectEntity, TextAreaEntity, TextEntity, -} from '../../types/globalConfig/entities'; -import { GlobalConfig } from '../../types/globalConfig/globalConfig'; +} from '../globalConfig/entities'; +import { GlobalConfig } from '../globalConfig/globalConfig'; import { PageContextProviderType } from '../../context/PageContext'; export type CurrentBaseFormInput =