@addev-be/ui 0.6.11 → 0.6.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@addev-be/ui",
-  "version": "0.6.11",
+  "version": "0.6.13",
   "type": "module",
   "scripts": {
     "watch": "tsc -b --watch",

package/src/components/data/DataGrid/helpers/columns.tsx

@@ -90,6 +90,8 @@ export const dateColumn = <R extends Record<string, any>>(
     name: title,
     type: 'date',
     render: (row) => moment(row[key]).format('DD/MM/YYYY') ?? '',
+    excelFormatter: () => 'dd/mm/yyyy',
+    excelValue: (date) => moment(date).format('DD/MM/YYYY') ?? '',
     getter: (row) => row[key] ?? '',
     sortGetter: (row) => row[key] ?? '',
     footer: (_, filteredRows) => `${filteredRows.length} éléments`,
@@ -101,6 +103,28 @@ export const dateColumn = <R extends Record<string, any>>(
   },
 });
 
+export const dateTimeColumn = <R extends Record<string, any>>(
+  key: string,
+  title: string,
+  options?: Partial<DataGridColumn<R>>
+): DataGridColumns<R> => ({
+  [key]: {
+    name: title,
+    type: 'date',
+    render: (row) => moment(row[key]).format('DD/MM/YYYY HH:mm:ss') ?? '',
+    excelFormatter: () => 'dd/mm/yyyy hh:mm:ss',
+    excelValue: (date) => moment(date).format('DD/MM/YYYY HH:mm:ss') ?? '',
+    getter: (row) => row[key] ?? '',
+    sortGetter: (row) => row[key] ?? '',
+    footer: (_, filteredRows) => `${filteredRows.length} éléments`,
+    filter: {
+      ...dateFilter(key),
+      renderer: (value) => moment(value).format('DD/MM/YYYY HH:mm:ss') ?? '',
+    },
+    ...options,
+  },
+});
+
 export const monthColumn = <R extends Record<string, any>>(
   key: string,
   title: string,

package/src/components/data/DataGrid/hooks/useDataGrid.tsx

@@ -58,7 +58,7 @@ export const useDataGrid = <R,>(
   const gridTemplateColumns = useMemo(
     () =>
       [
-        ...(selectable ? ['var(--space-10)'] : []),
+        ...(selectable ? ['var(--space-8)'] : []),
         ...visibleColumns.map(([, col]) => `${col.width ?? 150}px`),
       ].join(' '),
     [selectable, visibleColumns]

package/src/components/data/DataGrid/index.tsx

@@ -38,14 +38,16 @@ export const DataGridInner = <R,>(
     sortedRows,
     onVisibleRowsChange,
     refresh,
+    setSelectedKeys,
   } = contextProps;
 
   useImperativeHandle(
     ref,
     () => ({
       refresh,
+      setSelectedKeys,
     }),
-    [refresh]
+    [refresh, setSelectedKeys]
   );
 
   const hasFooter = Object.values(columns).some((col) => col.footer);

package/src/components/data/DataGrid/types.ts

@@ -270,4 +270,7 @@ export type DataGridRowTemplateProps<R> = {
   context: DataGridContext<R>;
 };
 
-export type DataGridRefProps<R> = Pick<DataGridContextProps<R>, 'refresh'>;
+export type DataGridRefProps<R> = Pick<
+  DataGridContextProps<R>,
+  'refresh' | 'setSelectedKeys'
+>;

package/src/components/data/SqlRequestDataGrid/helpers/columns.tsx

@@ -6,6 +6,7 @@ import {
   numberFilter,
   textFilter,
 } from '../../DataGrid/helpers';
+import { formatDate, formatDateTime } from '../../../../helpers/dates';
 import {
   formatMoney,
   formatNumber,
@@ -13,8 +14,6 @@ import {
   formatPercentage,
 } from '../../../../helpers/numbers';
 
-import { formatDate } from '../../../../helpers/dates';
-
 export const sqlTextColumn = <R extends Record<string, any>>(
   key: string,
   title: string,
@@ -121,6 +120,30 @@ export const sqlDateColumn = <R extends Record<string, any>>(
   },
 });
 
+export const sqlDateTimeColumn = <R extends Record<string, any>>(
+  key: string,
+  title: string,
+  options?: Partial<SqlRequestDataGridColumn<R>>
+): SqlRequestDataGridColumns<R> => ({
+  [key]: {
+    name: title,
+    type: 'date',
+    render: (row) => formatDateTime(row[key]),
+    getter: (row) => row[key] ?? '',
+    sortGetter: (row) => row[key] ?? '',
+    excelFormatter: () => 'dd/mm/yyyy hh:mm:ss',
+    excelValue: (value) => formatDateTime(value, 'YYYY-MM-DD HH:mm:ss'),
+    filter: {
+      ...textFilter(key),
+      getter: (value) => value[key] ?? '',
+      formatter: (value) => formatDateTime(value),
+      renderer: (value) => formatDateTime(value),
+    },
+    footer: (rows) => `${rows[0][key]} éléments`,
+    ...options,
+  },
+});
+
 export const sqlMonthColumn = <R extends Record<string, any>>(
   key: string,
   title: string,

package/src/components/data/SqlRequestDataGrid/index.tsx

@@ -43,6 +43,7 @@ export const SqlRequestDataGridInner = <R,>(
   const [sqlRequest, sqlIdRequest, sqlPartialRequest] = useSqlRequestHandler<R>(
     props.type
   );
+  const gridRef = useRef<DataGridRefProps<R>>(null);
 
   const [conditions, setConditions] = useState<Record<string, ConditionDTO>>(
     {}
@@ -348,12 +349,14 @@ export const SqlRequestDataGridInner = <R,>(
     ref,
     () => ({
       refresh,
+      setSelectedKeys: gridRef.current?.setSelectedKeys ?? (() => {}),
     }),
     [refresh]
   );
 
   return (
     <DataGrid
+      ref={gridRef}
       onVisibleRowsChange={onVisibleRowsChanged}
       filter={false}
       sort={false}

package/src/components/data/index.ts

@@ -1,12 +1,17 @@
 export * from './DataGrid';
 export * from './DataGrid/helpers';
 export * from './DataGrid/styles';
+export * from './DataGrid/types';
+
 export * from './AdvancedRequestDataGrid';
+export * from './AdvancedRequestDataGrid/helpers';
+
 export * from './SqlRequestDataGrid';
 export * from './SqlRequestDataGrid/helpers';
 export * from './SqlRequestDataGrid/types';
+
 export * from './SqlRequestGrid';
 export * from './SqlRequestGrid/types';
+
 export * from './VirtualScroller';
 export * from './VirtualScroller/types';
-export * from './AdvancedRequestDataGrid/helpers';

package/src/components/layout/Modal/styles.ts

@@ -1,5 +1,7 @@
 import styled, { css } from 'styled-components';
 
+import { ThemeColor } from '../../../providers';
+
 export const ModalBackdrop = styled.div.attrs({
   className: 'ModalBackdrop',
 })`
@@ -20,6 +22,7 @@ export type ModalContainerProps = {
   $height?: number;
   $zIndex?: number;
   $fullscreen?: boolean;
+  $color?: ThemeColor;
 };
 
 export const ModalContainer = styled.div.attrs({
@@ -51,6 +54,14 @@ export const ModalContainer = styled.div.attrs({
           width: ${$width ? `${$width}px` : 'auto'};
           height: ${$height ? `${$height}px` : 'auto'};
         `}
+
+  ${({ $color }) =>
+    $color
+      ? css`
+          border: 1px solid var(--color-${$color}-500);
+          box-shadow: 0 0 var(--space-3) var(--color-${$color}-500);
+        `
+      : null}
 `;
 
 export const ModalHeader = styled.div.attrs({ className: 'ModalHeader' })`

package/src/helpers/dates.ts

@@ -7,3 +7,11 @@ export const formatDate = (
   const m = moment.utc(date);
   return m.isValid() ? m.format(format) : '';
 };
+
+export const formatDateTime = (
+  date: moment.MomentInput,
+  format: string = 'DD/MM/YYYY HH:mm:ss'
+): string => {
+  const m = moment.utc(date);
+  return m.isValid() ? m.format(format) : '';
+};

package/src/services/index.ts

@@ -1,10 +1,15 @@
 export * from './WebSocketService';
 export * from './HttpService';
 export * from './hooks';
+export * from './globalSearch';
 
 export * from './requests/auth';
-export * from './globalSearch';
+export * from './requests/users';
+export * from './requests/userProfiles';
+export * from './requests/userPermissions';
 
 export * from './types/auth';
 export * from './types/base';
 export * from './types/users';
+export * from './types/userProfiles';
+export * from './types/userPermissions';

package/src/services/requests/userPermissions.ts

@@ -0,0 +1,36 @@
+import {
+  DeleteUserPermissionRequestDTO,
+  DeleteUserPermissionResponseDTO,
+  GetAllUserPermissionsRequestDTO,
+  GetAllUserPermissionsResponseDTO,
+  GetUserPermissionRequestDTO,
+  GetUserPermissionResponseDTO,
+  SaveUserPermissionRequestDTO,
+  SaveUserPermissionResponseDTO,
+} from '../types/userPermissions';
+
+import { useLoadingRequestHandler } from '../hooks';
+
+export const useGetUserPermissionRequestHandler = () =>
+  useLoadingRequestHandler<
+    GetUserPermissionRequestDTO,
+    GetUserPermissionResponseDTO
+  >('GetUserPermission');
+
+export const useGetAllUserPermissionsRequestHandler = () =>
+  useLoadingRequestHandler<
+    GetAllUserPermissionsRequestDTO,
+    GetAllUserPermissionsResponseDTO
+  >('GetAllUserPermissions');
+
+export const useSaveUserPermissionRequestHandler = () =>
+  useLoadingRequestHandler<
+    SaveUserPermissionRequestDTO,
+    SaveUserPermissionResponseDTO
+  >('SaveUserPermission');
+
+export const useDeleteUserPermissionRequestHandler = () =>
+  useLoadingRequestHandler<
+    DeleteUserPermissionRequestDTO,
+    DeleteUserPermissionResponseDTO
+  >('DeleteUserPermission');

package/src/services/requests/userProfiles.ts

@@ -0,0 +1,35 @@
+import {
+  DeleteUserProfileRequestDTO,
+  DeleteUserProfileResponseDTO,
+  GetAllUserProfilesRequestDTO,
+  GetAllUserProfilesResponseDTO,
+  GetUserProfileRequestDTO,
+  GetUserProfileResponseDTO,
+  SaveUserProfileRequestDTO,
+  SaveUserProfileResponseDTO,
+} from '../types/userProfiles';
+
+import { useLoadingRequestHandler } from '../hooks';
+
+export const useGetUserProfileRequestHandler = () =>
+  useLoadingRequestHandler<GetUserProfileRequestDTO, GetUserProfileResponseDTO>(
+    'GetUserProfile'
+  );
+
+export const useGetAllUserProfilesRequestHandler = () =>
+  useLoadingRequestHandler<
+    GetAllUserProfilesRequestDTO,
+    GetAllUserProfilesResponseDTO
+  >('GetAllUserProfiles');
+
+export const useSaveUserProfileRequestHandler = () =>
+  useLoadingRequestHandler<
+    SaveUserProfileRequestDTO,
+    SaveUserProfileResponseDTO
+  >('SaveUserProfile');
+
+export const useDeleteUserProfileRequestHandler = () =>
+  useLoadingRequestHandler<
+    DeleteUserProfileRequestDTO,
+    DeleteUserProfileResponseDTO
+  >('DeleteUserProfile');

package/src/services/requests/users.ts

@@ -0,0 +1,28 @@
+import {
+  DeleteUserRequestDTO,
+  DeleteUserResponseDTO,
+  GetAllUsersRequestDTO,
+  GetAllUsersResponseDTO,
+  GetUserRequestDTO,
+  GetUserResponseDTO,
+  SaveUserRequestDTO,
+  SaveUserResponseDTO,
+} from '../types/users';
+
+import { useLoadingRequestHandler } from '../hooks';
+
+export const useGetUserRequestHandler = () =>
+  useLoadingRequestHandler<GetUserRequestDTO, GetUserResponseDTO>('GetUser');
+
+export const useGetAllUsersRequestHandler = () =>
+  useLoadingRequestHandler<GetAllUsersRequestDTO, GetAllUsersResponseDTO>(
+    'GetAllUsers'
+  );
+
+export const useSaveUserRequestHandler = () =>
+  useLoadingRequestHandler<SaveUserRequestDTO, SaveUserResponseDTO>('SaveUser');
+
+export const useDeleteUserRequestHandler = () =>
+  useLoadingRequestHandler<DeleteUserRequestDTO, DeleteUserResponseDTO>(
+    'DeleteUser'
+  );

package/src/services/types/userPermissions.ts

@@ -0,0 +1,104 @@
+import * as t from 'io-ts';
+
+import { baseModelDtoCodec } from './base';
+
+export const userPermissionDtoCodec = t.type(
+  {
+    ...baseModelDtoCodec.props,
+    name: t.string,
+  },
+  'UserPermissionDTO'
+);
+
+export type UserPermissionDTO = t.TypeOf<typeof userPermissionDtoCodec>;
+
+/*****/
+
+export const getUserPermissionRequestDtoCodec = t.type(
+  {
+    id: t.string,
+  },
+  'GetUserPermissionRequestDTO'
+);
+
+export const getUserPermissionResponseDtoCodec = t.type(
+  {
+    data: userPermissionDtoCodec,
+  },
+  'GetUserPermissionResponseDTO'
+);
+
+export type GetUserPermissionRequestDTO = t.TypeOf<
+  typeof getUserPermissionRequestDtoCodec
+>;
+export type GetUserPermissionResponseDTO = t.TypeOf<
+  typeof getUserPermissionResponseDtoCodec
+>;
+
+/*****/
+
+export const getAllUserPermissionsRequestDtoCodec = t.type(
+  {},
+  'GetAllUserPermissionsRequestDTO'
+);
+
+export const getAllUserPermissionsResponseDtoCodec = t.type(
+  {
+    data: t.array(userPermissionDtoCodec),
+  },
+  'GetAllUserPermissionsResponseDTO'
+);
+
+export type GetAllUserPermissionsRequestDTO = t.TypeOf<
+  typeof getAllUserPermissionsRequestDtoCodec
+>;
+export type GetAllUserPermissionsResponseDTO = t.TypeOf<
+  typeof getAllUserPermissionsResponseDtoCodec
+>;
+
+/*****/
+
+export const saveUserPermissionRequestDtoCodec = t.type(
+  {
+    id: t.string,
+  },
+  'SaveUserPermissionRequestDTO'
+);
+
+export const saveUserPermissionResponseDtoCodec = t.type(
+  {
+    status: t.number,
+    data: userPermissionDtoCodec,
+  },
+  'SaveUserPermissionResponseDTO'
+);
+
+export type SaveUserPermissionRequestDTO = t.TypeOf<
+  typeof saveUserPermissionRequestDtoCodec
+>;
+export type SaveUserPermissionResponseDTO = t.TypeOf<
+  typeof saveUserPermissionResponseDtoCodec
+>;
+
+/*****/
+
+export const deleteUserPermissionRequestDtoCodec = t.type(
+  {
+    id: t.string,
+  },
+  'DeleteUserPermissionRequestDTO'
+);
+
+export const deleteUserPermissionResponseDtoCodec = t.type(
+  {
+    status: t.number,
+  },
+  'DeleteUserPermissionResponseDTO'
+);
+
+export type DeleteUserPermissionRequestDTO = t.TypeOf<
+  typeof deleteUserPermissionRequestDtoCodec
+>;
+export type DeleteUserPermissionResponseDTO = t.TypeOf<
+  typeof deleteUserPermissionResponseDtoCodec
+>;

package/src/services/types/userProfiles.ts

@@ -0,0 +1,105 @@
+import * as t from 'io-ts';
+
+import { baseModelDtoCodec } from './base';
+
+export const userProfileDtoCodec = t.type(
+  {
+    ...baseModelDtoCodec.props,
+    name: t.string,
+    isAdmin: t.string,
+  },
+  'UserProfileDTO'
+);
+
+export type UserProfileDTO = t.TypeOf<typeof userProfileDtoCodec>;
+
+/*****/
+
+export const getUserProfileRequestDtoCodec = t.type(
+  {
+    id: t.string,
+  },
+  'GetUserProfileRequestDTO'
+);
+
+export const getUserProfileResponseDtoCodec = t.type(
+  {
+    data: userProfileDtoCodec,
+  },
+  'GetUserProfileResponseDTO'
+);
+
+export type GetUserProfileRequestDTO = t.TypeOf<
+  typeof getUserProfileRequestDtoCodec
+>;
+export type GetUserProfileResponseDTO = t.TypeOf<
+  typeof getUserProfileResponseDtoCodec
+>;
+
+/*****/
+
+export const getAllUserProfilesRequestDtoCodec = t.type(
+  {},
+  'GetAllUserProfilesRequestDTO'
+);
+
+export const getAllUserProfilesResponseDtoCodec = t.type(
+  {
+    data: t.array(userProfileDtoCodec),
+  },
+  'GetAllUserProfilesResponseDTO'
+);
+
+export type GetAllUserProfilesRequestDTO = t.TypeOf<
+  typeof getAllUserProfilesRequestDtoCodec
+>;
+export type GetAllUserProfilesResponseDTO = t.TypeOf<
+  typeof getAllUserProfilesResponseDtoCodec
+>;
+
+/*****/
+
+export const saveUserProfileRequestDtoCodec = t.type(
+  {
+    id: t.string,
+  },
+  'SaveUserProfileRequestDTO'
+);
+
+export const saveUserProfileResponseDtoCodec = t.type(
+  {
+    status: t.number,
+    data: userProfileDtoCodec,
+  },
+  'SaveUserProfileResponseDTO'
+);
+
+export type SaveUserProfileRequestDTO = t.TypeOf<
+  typeof saveUserProfileRequestDtoCodec
+>;
+export type SaveUserProfileResponseDTO = t.TypeOf<
+  typeof saveUserProfileResponseDtoCodec
+>;
+
+/*****/
+
+export const deleteUserProfileRequestDtoCodec = t.type(
+  {
+    id: t.string,
+  },
+  'DeleteUserProfileRequestDTO'
+);
+
+export const deleteUserProfileResponseDtoCodec = t.type(
+  {
+    status: t.number,
+  },
+  'DeleteUserProfileResponseDTO'
+);
+
+export type DeleteUserProfileRequestDTO = t.TypeOf<
+  typeof deleteUserProfileRequestDtoCodec
+>;
+export type DeleteUserProfileResponseDTO = t.TypeOf<
+  typeof deleteUserProfileResponseDtoCodec
+>;

package/src/services/types/users.ts

@@ -7,6 +7,7 @@ export const userDtoCodec = t.intersection(
     t.type({
       ...baseModelDtoCodec.props,
       username: t.string,
+      isAdmin: t.boolean,
     }),
     t.partial({
       name: t.string,
@@ -18,3 +19,77 @@ export const userDtoCodec = t.intersection(
 );
 
 export type UserDTO = t.TypeOf<typeof userDtoCodec>;
+
+/*****/
+
+export const getUserRequestDtoCodec = t.type(
+  {
+    id: t.string,
+  },
+  'GetUserRequestDTO'
+);
+
+export const getUserResponseDtoCodec = t.type(
+  {
+    data: userDtoCodec,
+  },
+  'GetUserResponseDTO'
+);
+
+export type GetUserRequestDTO = t.TypeOf<typeof getUserRequestDtoCodec>;
+export type GetUserResponseDTO = t.TypeOf<typeof getUserResponseDtoCodec>;
+
+/*****/
+
+export const getAllUsersRequestDtoCodec = t.type({}, 'GetAllUsersRequestDTO');
+
+export const getAllUsersResponseDtoCodec = t.type(
+  {
+    data: t.array(userDtoCodec),
+  },
+  'GetAllUsersResponseDTO'
+);
+
+export type GetAllUsersRequestDTO = t.TypeOf<typeof getAllUsersRequestDtoCodec>;
+export type GetAllUsersResponseDTO = t.TypeOf<
+  typeof getAllUsersResponseDtoCodec
+>;
+
+/*****/
+
+export const saveUserRequestDtoCodec = t.type(
+  {
+    id: t.string,
+  },
+  'SaveUserRequestDTO'
+);
+
+export const saveUserResponseDtoCodec = t.type(
+  {
+    status: t.number,
+    data: userDtoCodec,
+  },
+  'SaveUserResponseDTO'
+);
+
+export type SaveUserRequestDTO = t.TypeOf<typeof saveUserRequestDtoCodec>;
+export type SaveUserResponseDTO = t.TypeOf<typeof saveUserResponseDtoCodec>;
+
+/*****/
+
+export const deleteUserRequestDtoCodec = t.type(
+  {
+    id: t.string,
+  },
+  'DeleteUserRequestDTO'
+);
+
+export const deleteUserResponseDtoCodec = t.type(
+  {
+    status: t.number,
+  },
+  'DeleteUserResponseDTO'
+);
+
+export type DeleteUserRequestDTO = t.TypeOf<typeof deleteUserRequestDtoCodec>;
+export type DeleteUserResponseDTO = t.TypeOf<typeof deleteUserResponseDtoCodec>;