From 30f5dc8959612e4325afc7f5b890c2c16f6d030e Mon Sep 17 00:00:00 2001 From: Thomas Lathuiliere <40292402+balzdur@users.noreply.github.com> Date: Tue, 22 Oct 2024 13:17:12 +0200 Subject: [PATCH] feat(tables): implement new UI (#565) * feat: inline blocked and review with icon * refactor(tables): use transparent color for hover transitions * feat(Table): change default theme --- .../src/components/Cases/CasesList.tsx | 2 +- .../src/components/Data/TableDetails.tsx | 10 ++++-- .../components/Decisions/DecisionsList.tsx | 2 +- .../Decisions/OutcomeAndReviewStatus.tsx | 34 +++++++++---------- .../ScheduledExecutionsList.tsx | 2 +- .../components/TransferAlerts/AlertsList.tsx | 2 +- .../components/Transfers/TransfersList.tsx | 2 +- .../src/routes/_builder+/lists+/$listId.tsx | 2 +- .../src/routes/_builder+/lists+/_index.tsx | 2 +- .../i+/$iterationId+/_edit-view+/rules.tsx | 2 +- .../routes/_builder+/settings+/api-keys.tsx | 4 +-- .../_builder+/settings+/inboxes.$inboxId.tsx | 6 ++-- .../_builder+/settings+/inboxes._index.tsx | 2 +- .../src/routes/_builder+/settings+/tags.tsx | 4 +-- .../src/routes/_builder+/settings+/users.tsx | 4 +-- .../routes/_builder+/settings+/webhooks.tsx | 4 +-- .../routes/_builder+/workflows+/_index.tsx | 2 +- packages/ui-design-system/src/Table/Table.tsx | 17 ++++------ .../src/generated/icons-svg-sprite.svg | 2 +- packages/ui-icons/svgs/icons/policy.svg | 2 +- 20 files changed, 53 insertions(+), 54 deletions(-) diff --git a/packages/app-builder/src/components/Cases/CasesList.tsx b/packages/app-builder/src/components/Cases/CasesList.tsx index 239f0e3de..f10c3244b 100644 --- a/packages/app-builder/src/components/Cases/CasesList.tsx +++ b/packages/app-builder/src/components/Cases/CasesList.tsx @@ -96,7 +96,7 @@ export function CasesList({ return ( { navigate( diff --git a/packages/app-builder/src/components/Data/TableDetails.tsx b/packages/app-builder/src/components/Data/TableDetails.tsx index 4515f38a2..f3296d8da 100644 --- a/packages/app-builder/src/components/Data/TableDetails.tsx +++ b/packages/app-builder/src/components/Data/TableDetails.tsx @@ -128,7 +128,7 @@ export function TableDetails({ tableModel, dataModel }: TableDetailsProps) { /> @@ -281,7 +281,7 @@ function TableDetailFields({ field={cell.row.original} linksToThisTable={linksToThisTable} > -
+
@@ -308,7 +308,11 @@ function TableDetailFields({ {rows.map((row) => ( - + ))} diff --git a/packages/app-builder/src/components/Decisions/DecisionsList.tsx b/packages/app-builder/src/components/Decisions/DecisionsList.tsx index a2eccb6ed..a096f4b6d 100644 --- a/packages/app-builder/src/components/Decisions/DecisionsList.tsx +++ b/packages/app-builder/src/components/Decisions/DecisionsList.tsx @@ -299,7 +299,7 @@ export function DecisionsList({ ); diff --git a/packages/app-builder/src/components/Decisions/OutcomeAndReviewStatus.tsx b/packages/app-builder/src/components/Decisions/OutcomeAndReviewStatus.tsx index 529b5e1f0..eca80d862 100644 --- a/packages/app-builder/src/components/Decisions/OutcomeAndReviewStatus.tsx +++ b/packages/app-builder/src/components/Decisions/OutcomeAndReviewStatus.tsx @@ -3,6 +3,8 @@ import { type Outcome as TOutcome } from '@app-builder/models/outcome'; import clsx from 'clsx'; import * as React from 'react'; import * as R from 'remeda'; +import { Tooltip } from 'ui-design-system'; +import { Icon } from 'ui-icons'; import { OutcomeTag, useOutcomes } from './OutcomeTag'; import { ReviewStatusTag, useReviewStatuses } from './ReviewStatusTag'; @@ -63,27 +65,23 @@ export function OutcomeAndReviewStatus({ } return ( -
- + + } + > +
+ +
+
+ + - - - -
); } diff --git a/packages/app-builder/src/components/ScheduledExecutions/ScheduledExecutionsList.tsx b/packages/app-builder/src/components/ScheduledExecutions/ScheduledExecutionsList.tsx index 6c6c6ef68..0a3650859 100644 --- a/packages/app-builder/src/components/ScheduledExecutions/ScheduledExecutionsList.tsx +++ b/packages/app-builder/src/components/ScheduledExecutions/ScheduledExecutionsList.tsx @@ -142,7 +142,7 @@ export function ScheduledExecutionsList({ return ( ); diff --git a/packages/app-builder/src/components/TransferAlerts/AlertsList.tsx b/packages/app-builder/src/components/TransferAlerts/AlertsList.tsx index 74e6ea27d..e00fd14d3 100644 --- a/packages/app-builder/src/components/TransferAlerts/AlertsList.tsx +++ b/packages/app-builder/src/components/TransferAlerts/AlertsList.tsx @@ -213,7 +213,7 @@ function AlertsListTable({ key={row.id} tabIndex={0} className={clsx( - 'hover:bg-grey-02 relative cursor-pointer', + 'hover:bg-purple-05 relative cursor-pointer', bgClassName, )} row={row} diff --git a/packages/app-builder/src/components/Transfers/TransfersList.tsx b/packages/app-builder/src/components/Transfers/TransfersList.tsx index 827577e1a..46e93bc89 100644 --- a/packages/app-builder/src/components/Transfers/TransfersList.tsx +++ b/packages/app-builder/src/components/Transfers/TransfersList.tsx @@ -87,7 +87,7 @@ export function TransfersList({ className, transfers }: TransfersListProps) { ); diff --git a/packages/app-builder/src/routes/_builder+/lists+/$listId.tsx b/packages/app-builder/src/routes/_builder+/lists+/$listId.tsx index dac7bac2f..04954e668 100644 --- a/packages/app-builder/src/routes/_builder+/lists+/$listId.tsx +++ b/packages/app-builder/src/routes/_builder+/lists+/$listId.tsx @@ -82,7 +82,7 @@ export default function Lists() { value={value} >