Merge branch 'dev' into BAL-3165

apps/backoffice-v2/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @ballerine/backoffice-v2
 
+## 0.7.81
+
+### Patch Changes
+
+- Bump
+- Updated dependencies
+  - @ballerine/blocks@0.2.29
+  - @ballerine/common@0.9.58
+  - @ballerine/react-pdf-toolkit@1.2.50
+  - @ballerine/ui@0.5.50
+  - @ballerine/workflow-browser-sdk@0.6.77
+  - @ballerine/workflow-node-sdk@0.6.77
+
+## 0.7.80
+
+### Patch Changes
+
+- @ballerine/workflow-browser-sdk@0.6.76
+- @ballerine/workflow-node-sdk@0.6.76
+
 ## 0.7.79
 
 ### Patch Changes

apps/backoffice-v2/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ballerine/backoffice-v2",
-  "version": "0.7.79",
+  "version": "0.7.81",
   "description": "Ballerine - Backoffice",
   "homepage": "https://github.com/ballerine-io/ballerine",
   "type": "module",
@@ -51,12 +51,12 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "@ballerine/blocks": "0.2.28",
-    "@ballerine/common": "0.9.57",
-    "@ballerine/react-pdf-toolkit": "^1.2.48",
-    "@ballerine/ui": "^0.5.48",
-    "@ballerine/workflow-browser-sdk": "0.6.75",
-    "@ballerine/workflow-node-sdk": "0.6.75",
+    "@ballerine/blocks": "0.2.29",
+    "@ballerine/common": "0.9.58",
+    "@ballerine/react-pdf-toolkit": "^1.2.50",
+    "@ballerine/ui": "^0.5.50",
+    "@ballerine/workflow-browser-sdk": "0.6.77",
+    "@ballerine/workflow-node-sdk": "0.6.77",
     "@botpress/webchat": "^2.1.10",
     "@botpress/webchat-generator": "^0.2.9",
     "@fontsource/inter": "^4.5.15",
@@ -148,8 +148,8 @@
     "zod": "^3.22.3"
   },
   "devDependencies": {
-    "@ballerine/config": "^1.1.26",
-    "@ballerine/eslint-config-react": "^2.0.26",
+    "@ballerine/config": "^1.1.27",
+    "@ballerine/eslint-config-react": "^2.0.27",
     "@cspell/cspell-types": "^6.31.1",
     "@faker-js/faker": "^7.6.0",
     "@playwright/test": "^1.32.1",

apps/backoffice-v2/src/lib/blocks/hooks/useDocumentBlocks/useDocumentBlocks.tsx

@@ -440,14 +440,12 @@ export const useDocumentBlocks = ({
                       const fieldValue = getFieldValue();
                       const isEditableDecision = isDoneWithRevision || !decision?.status;
                       const isIndividual = checkIsIndividual(workflow);
-                      const isEditableType = (title === 'type' && isIndividual) || title !== 'type';
                       const isEditableCategory =
                         (title === 'category' && isIndividual) || title !== 'category';
                       const isEditableField = [
                         isEditableDecision,
                         isEditable,
                         caseState.writeEnabled,
-                        isEditableType,
                         isEditableCategory,
                       ].every(Boolean);
 

apps/kyb-app/CHANGELOG.md

@@ -1,5 +1,22 @@
 # kyb-app
 
+## 0.3.93
+
+### Patch Changes
+
+- Bump
+- Updated dependencies
+  - @ballerine/blocks@0.2.29
+  - @ballerine/common@0.9.58
+  - @ballerine/ui@0.5.50
+  - @ballerine/workflow-browser-sdk@0.6.77
+
+## 0.3.92
+
+### Patch Changes
+
+- @ballerine/workflow-browser-sdk@0.6.76
+
 ## 0.3.91
 
 ### Patch Changes

apps/kyb-app/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ballerine/kyb-app",
   "private": true,
-  "version": "0.3.91",
+  "version": "0.3.93",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -15,10 +15,10 @@
     "test:dev": "vitest"
   },
   "dependencies": {
-    "@ballerine/blocks": "0.2.28",
-    "@ballerine/common": "^0.9.57",
-    "@ballerine/ui": "0.5.49",
-    "@ballerine/workflow-browser-sdk": "0.6.75",
+    "@ballerine/blocks": "0.2.29",
+    "@ballerine/common": "^0.9.58",
+    "@ballerine/ui": "0.5.50",
+    "@ballerine/workflow-browser-sdk": "0.6.77",
     "@lukemorales/query-key-factory": "^1.0.3",
     "@radix-ui/react-icons": "^1.3.0",
     "@rjsf/core": "^5.9.0",
@@ -64,8 +64,8 @@
     "zod": "^3.23.4"
   },
   "devDependencies": {
-    "@ballerine/config": "^1.1.26",
-    "@ballerine/eslint-config-react": "^2.0.26",
+    "@ballerine/config": "^1.1.27",
+    "@ballerine/eslint-config-react": "^2.0.27",
     "@jest/globals": "^29.7.0",
     "@sentry/vite-plugin": "^2.9.0",
     "@testing-library/jest-dom": "^6.1.4",

apps/kyb-app/src/pages/CollectionFlow/CollectionFlow.tsx

@@ -246,19 +246,43 @@ export const CollectionFlow = withSessionProtected(() => {
                               <AppShell.Content>
                                 <AppShell.FormContainer>
                                   {localStorage.getItem('devmode') ? (
-                                    <div className="flex flex-col gap-4">
-                                      DEBUG
-                                      <div>
-                                        {currentPage
-                                          ? currentPage.stateName
-                                          : 'Page not found and state ' + state}
+                                    <div className="mb-6 rounded-lg border border-amber-200 bg-amber-50 p-4">
+                                      <div className="mb-4 flex items-center gap-2">
+                                        <div className="h-2 w-2 animate-pulse rounded-full bg-amber-500" />
+                                        <span
+                                          className="cursor-help font-medium text-amber-900 hover:underline"
+                                          data-tooltip-id="debug-mode-tooltip"
+                                          data-tooltip-content="In debug mode you can navigate between steps without validation. Be aware that if required data is missing, plugins may fail when processing data at the end of the flow."
+                                        >
+                                          Debug Mode Active
+                                        </span>
                                       </div>
-                                      <div className="flex gap-4">
-                                        <button onClick={() => stateApi.sendEvent('PREVIOUS')}>
-                                          prev
+
+                                      <div className="mb-3 text-sm text-amber-800">
+                                        Current State:{' '}
+                                        {currentPage ? (
+                                          <span className="font-medium">
+                                            {currentPage.stateName}
+                                          </span>
+                                        ) : (
+                                          <span className="italic">
+                                            Page not found - state: {state}
+                                          </span>
+                                        )}
+                                      </div>
+
+                                      <div className="flex gap-3">
+                                        <button
+                                          onClick={() => stateApi.sendEvent('PREVIOUS')}
+                                          className="rounded bg-amber-100 px-3 py-1.5 text-sm font-medium text-amber-900 transition-colors hover:bg-amber-200"
+                                        >
+                                          Previous
                                         </button>
-                                        <button onClick={() => stateApi.sendEvent('NEXT')}>
-                                          next
+                                        <button
+                                          onClick={() => stateApi.sendEvent('NEXT')}
+                                          className="rounded bg-amber-100 px-3 py-1.5 text-sm font-medium text-amber-900 transition-colors hover:bg-amber-200"
+                                        >
+                                          Next
                                         </button>
                                       </div>
                                     </div>

apps/workflows-dashboard/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @ballerine/workflows-dashboard
 
+## 0.2.27
+
+### Patch Changes
+
+- Bump
+- Updated dependencies
+  - @ballerine/common@0.9.58
+  - @ballerine/ui@0.5.50
+
 ## 0.2.26
 
 ### Patch Changes

apps/workflows-dashboard/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ballerine/workflows-dashboard",
   "private": false,
-  "version": "0.2.26",
+  "version": "0.2.27",
   "type": "module",
   "scripts": {
     "spellcheck": "cspell \"*\"",
@@ -15,8 +15,8 @@
     "test": "NODE_ENV=test jest"
   },
   "dependencies": {
-    "@ballerine/common": "^0.9.55",
-    "@ballerine/ui": "^0.5.48",
+    "@ballerine/common": "^0.9.58",
+    "@ballerine/ui": "^0.5.50",
     "@lukemorales/query-key-factory": "^1.0.3",
     "@radix-ui/react-avatar": "^1.0.3",
     "@radix-ui/react-dialog": "1.0.4",
@@ -63,8 +63,8 @@
     "zod": "^3.22.3"
   },
   "devDependencies": {
-    "@ballerine/config": "^1.1.26",
-    "@ballerine/eslint-config-react": "^2.0.26",
+    "@ballerine/config": "^1.1.27",
+    "@ballerine/eslint-config-react": "^2.0.27",
     "@cspell/cspell-types": "^6.31.1",
     "@types/axios": "^0.14.0",
     "@types/classnames": "^2.3.1",

apps/workflows-dashboard/src/components/molecules/WorkflowsTable/columns.tsx

@@ -7,31 +7,64 @@ import { WorkflowTableColumnDef } from '@/components/molecules/WorkflowsTable/ty
 import { IWorkflow } from '@/domains/workflows/api/workflow';
 import { formatDate } from '@/utils/format-date';
 import { getWorkflowHealthStatus } from '@/utils/get-workflow-health-status';
+import { Eye } from 'lucide-react';
+import { toast } from 'sonner';
 
-export const defaultColumns: WorkflowTableColumnDef<IWorkflow>[] = [
+export const defaultColumns: Array<WorkflowTableColumnDef<IWorkflow>> = [
   {
     accessorKey: 'id',
-    cell: info => info.getValue<string>(),
-    header: () => 'ID',
+    cell: info => (
+      <div className="flex items-center gap-2">
+        <span className="font-mono text-sm text-gray-600">{info.getValue<string>()}</span>
+        <button
+          onClick={() => {
+            navigator.clipboard
+              .writeText(info.getValue<string>())
+              .then(() => {
+                toast.success('ID copied to clipboard');
+              })
+              .catch(() => {
+                toast.error('Failed to copy ID to clipboard');
+              });
+          }}
+          className="text-gray-400 hover:text-gray-600"
+        >
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            className="h-4 w-4"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            strokeWidth="2"
+            strokeLinecap="round"
+            strokeLinejoin="round"
+          >
+            <rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
+            <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path>
+          </svg>
+        </button>
+      </div>
+    ),
+    header: () => <span className="font-semibold">ID</span>,
   },
   {
     accessorKey: 'workflowDefinitionName',
-    cell: info => info.getValue<string>(),
+    cell: info => <span className="font-medium text-blue-600">{info.getValue<string>()}</span>,
     header: ({ column }) => (
       <DataTableColumnHeader column={column} title="Workflow Definition Name" />
     ),
   },
   {
     accessorKey: 'workflowDefinitionId',
     cell: info => <CloneWorkflowDefinitionButton workflowDefinitionId={info.getValue<string>()} />,
-    header: '',
+    header: () => '',
   },
   {
     accessorKey: 'status',
     cell: info => (
-      <div className="font-inter flex flex-row flex-nowrap gap-4 font-medium capitalize">
+      <div className="flex items-center gap-4">
         <HealthIndicator healthStatus={getWorkflowHealthStatus(info.row.original)} />
-        {info.getValue<string>() || ''}
+        <span className="font-medium capitalize">{info.getValue<string>() || ''}</span>
       </div>
     ),
     header: ({ column }) => <DataTableColumnHeader column={column} title="Status" />,
@@ -50,34 +83,47 @@ export const defaultColumns: WorkflowTableColumnDef<IWorkflow>[] = [
   {
     accessorKey: 'assignee',
     accessorFn: row => (row.assignee ? `${row.assignee.firstName} ${row.assignee.lastName}` : '-'),
-    cell: info => info.getValue<string>(),
+    cell: info => <span className="text-gray-700">{info.getValue<string>()}</span>,
     header: ({ column }) => <DataTableColumnHeader column={column} title="Assign To" />,
   },
   {
     accessorKey: 'context',
     accessorFn: row => JSON.stringify(row.context),
-    cell: info => <JSONViewButton json={info.getValue<string>()} />,
-    header: () => 'Context',
+    cell: info => (
+      <div className="flex flex-row items-center gap-3">
+        <JSONViewButton
+          trigger={
+            <Eye className="h-5 w-5 cursor-pointer text-gray-600 transition-colors hover:text-blue-600" />
+          }
+          json={info.getValue<string>()}
+        />
+      </div>
+    ),
+    header: () => <span className="font-semibold">Context</span>,
   },
   {
     accessorKey: 'view-workflow',
     accessorFn: row => row.id,
     cell: () => '-',
-    header: () => 'Workflow',
+    header: () => <span className="font-semibold">Workflow</span>,
   },
   {
     accessorKey: 'resolvedAt',
-    cell: info => (info.getValue<Date>() ? formatDate(info.getValue<Date>()) : '-'),
+    cell: info => (
+      <span className="text-gray-700">
+        {info.getValue<Date>() ? formatDate(info.getValue<Date>()) : '-'}
+      </span>
+    ),
     header: ({ column }) => <DataTableColumnHeader column={column} title="Resolved At" />,
   },
   {
     accessorKey: 'createdBy',
-    cell: info => info.getValue<string>(),
+    cell: info => <span className="text-gray-700">{info.getValue<string>()}</span>,
     header: ({ column }) => <DataTableColumnHeader column={column} title="Created By" />,
   },
   {
     accessorKey: 'createdAt',
-    cell: info => formatDate(info.getValue<Date>()),
+    cell: info => <span className="text-gray-700">{formatDate(info.getValue<Date>())}</span>,
     header: ({ column }) => <DataTableColumnHeader column={column} title="Created At" />,
   },
 ];

apps/workflows-dashboard/src/domains/filters/filters.api.ts

@@ -1,4 +1,8 @@
-import { GetFiltersListDto, GetFiltersResponse } from '@/domains/filters/filters.types';
+import {
+  CreateFilterDto,
+  GetFiltersListDto,
+  GetFiltersResponse,
+} from '@/domains/filters/filters.types';
 import { request } from '@/lib/request';
 
 export const fetchFiltersList = async (query: GetFiltersListDto) => {
@@ -8,3 +12,9 @@ export const fetchFiltersList = async (query: GetFiltersListDto) => {
 
   return result.data;
 };
+
+export const createFilter = async (dto: CreateFilterDto) => {
+  const result = await request.post('/external/filters', dto);
+
+  return result.data;
+};