Changes the default behavior for settings navigation items to stay active when navigating to sub-pages. **Problem:** - Navigation items like "Data Model" and "Webhooks" were not staying highlighted when navigating to detail pages - This was because `matchSubPages` defaulted to requiring exact path matches **Solution:** - Updated logic to make sub-page matching the default behavior (`end: item.matchSubPages === false`) - Only "Accounts" explicitly sets `matchSubPages: false` for its custom sub-item navigation - Removed redundant `matchSubPages: true` declarations throughout the codebase **URL Changes:** -- checked with @Bonapara - `/settings/workspace` → `/settings/general` - `/settings/workspace-members` → `/settings/members` - `/settings/api-keys` → `/settings/apis` - `/settings/developers/webhooks` → `/settings/webhooks` before: https://github.com/user-attachments/assets/56b94a49-9c31-4bb5-9875-ec24f4bc4d1e after: https://github.com/user-attachments/assets/38742599-c045-44d1-8020-56f3eacca779 --------- Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
51 lines
1.8 KiB
TypeScript
51 lines
1.8 KiB
TypeScript
import styled from '@emotion/styled';
|
|
|
|
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
|
|
import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
|
|
import { SettingsDevelopersWebhookTableRow } from '@/settings/developers/components/SettingsDevelopersWebhookTableRow';
|
|
import { Webhook } from '@/settings/developers/types/webhook/Webhook';
|
|
import { SettingsPath } from '@/types/SettingsPath';
|
|
import { Table } from '@/ui/layout/table/components/Table';
|
|
import { TableBody } from '@/ui/layout/table/components/TableBody';
|
|
import { TableHeader } from '@/ui/layout/table/components/TableHeader';
|
|
import { TableRow } from '@/ui/layout/table/components/TableRow';
|
|
import { getSettingsPath } from '~/utils/navigation/getSettingsPath';
|
|
|
|
const StyledTableBody = styled(TableBody)`
|
|
border-bottom: 1px solid ${({ theme }) => theme.border.color.light};
|
|
max-height: 260px;
|
|
overflow-y: auto;
|
|
`;
|
|
|
|
const StyledTableRow = styled(TableRow)`
|
|
grid-template-columns: 444px 68px;
|
|
`;
|
|
|
|
export const SettingsWebhooksTable = () => {
|
|
const { records: webhooks } = useFindManyRecords<Webhook>({
|
|
objectNameSingular: CoreObjectNameSingular.Webhook,
|
|
});
|
|
|
|
return (
|
|
<Table>
|
|
<StyledTableRow>
|
|
<TableHeader>URL</TableHeader>
|
|
<TableHeader></TableHeader>
|
|
</StyledTableRow>
|
|
{!!webhooks.length && (
|
|
<StyledTableBody>
|
|
{webhooks.map((webhookFieldItem) => (
|
|
<SettingsDevelopersWebhookTableRow
|
|
key={webhookFieldItem.id}
|
|
fieldItem={webhookFieldItem}
|
|
to={getSettingsPath(SettingsPath.WebhookDetail, {
|
|
webhookId: webhookFieldItem.id,
|
|
})}
|
|
/>
|
|
))}
|
|
</StyledTableBody>
|
|
)}
|
|
</Table>
|
|
);
|
|
};
|