diff --git a/.cspell.json b/.cspell.json index e77a36fe2..da704626d 100644 --- a/.cspell.json +++ b/.cspell.json @@ -7,7 +7,7 @@ "codecov", "bulma", "unmount", "testid", "woff", "iife", "sourcemap", "Roboto", "camelize", "datepicker", "camelcase", "fullwidth", "wysiwig", "Helvetica", "Neue", "Arial", "nowrap", "textfield", "scrollable", "flexbox", "treal", "xxxl", - "adminbro", "Checkmark", "overridable", "Postgres", "Hana", "Wojtek", "Krysiak" + "adminbro", "Checkmark", "overridable", "Postgres", "Hana", "Wojtek", "Krysiak", "bigint" ], "ignorePaths": [ "src/frontend/assets/**/*" diff --git a/src/frontend/components/app/action-header/action-header.tsx b/src/frontend/components/app/action-header/action-header.tsx index 21c865872..54fe88c14 100644 --- a/src/frontend/components/app/action-header/action-header.tsx +++ b/src/frontend/components/app/action-header/action-header.tsx @@ -1,7 +1,7 @@ /* eslint-disable jsx-a11y/anchor-is-valid */ import React from 'react' import { Box, Badge, H3, H2, ButtonGroup, cssClass } from '@admin-bro/design-system' -import { useHistory, useLocation } from 'react-router' +import { useHistory } from 'react-router' import Breadcrumbs from '../breadcrumbs' import { ActionHeaderProps } from './action-header-props' @@ -29,7 +29,6 @@ export const ActionHeader: React.FC = (props) => { } = props const { translateButton } = useTranslation() - const location = useLocation() const history = useHistory() const actionResponseHandler = useActionResponseHandler(actionPerformed) @@ -45,7 +44,6 @@ export const ActionHeader: React.FC = (props) => { action: sourceAction, params, actionResponseHandler, - search: location.search, push: history.push, })(event) ) @@ -56,7 +54,6 @@ export const ActionHeader: React.FC = (props) => { // only new action should be seen in regular "Big" actions place : resource.resourceActions.filter(ra => ra.name === 'new' && (!action || action.name !== ra.name)), params, - search: location.search, handleClick: handleActionClick, }) @@ -72,7 +69,6 @@ export const ActionHeader: React.FC = (props) => { const customResourceButtons = actionsToButtonGroup({ actions: resource.resourceActions.filter(ra => !['list', 'new'].includes(ra.name)), params: { resourceId }, - search: location.search, handleClick: handleActionClick, }) diff --git a/src/frontend/components/app/action-header/actions-to-button-group.spec.ts b/src/frontend/components/app/action-header/actions-to-button-group.spec.ts index 8e8c163b6..ad6d90358 100644 --- a/src/frontend/components/app/action-header/actions-to-button-group.spec.ts +++ b/src/frontend/components/app/action-header/actions-to-button-group.spec.ts @@ -16,7 +16,6 @@ describe('actionsToButtonGroup', () => { } let buttonGroupProps: ButtonGroupProps['buttons'] - const search = '' const handleClick = () => true context('flat actions (no nesting)', () => { @@ -28,7 +27,6 @@ describe('actionsToButtonGroup', () => { buttonGroupProps = actionsToButtonGroup({ actions, params, - search, handleClick, }) }) @@ -75,7 +73,6 @@ describe('actionsToButtonGroup', () => { ...actionsExport, ], params, - search, handleClick, }) }) @@ -107,7 +104,6 @@ describe('actionsToButtonGroup', () => { buttonGroupProps = actionsToButtonGroup({ actions, params, - search, handleClick, }) }) diff --git a/src/frontend/components/app/action-header/actions-to-button-group.ts b/src/frontend/components/app/action-header/actions-to-button-group.ts index 60dfef05e..023eaa485 100644 --- a/src/frontend/components/app/action-header/actions-to-button-group.ts +++ b/src/frontend/components/app/action-header/actions-to-button-group.ts @@ -6,16 +6,15 @@ import { DifferentActionParams } from '../../../hooks' export type actionsToButtonGroupOptions = { actions: Array; params: DifferentActionParams; - search: Location['search']; handleClick: ButtonInGroupProps['onClick']; } export const actionsToButtonGroup = ( options: actionsToButtonGroupOptions, ): ButtonGroupProps['buttons'] => { - const { actions, params, search, handleClick } = options + const { actions, params, handleClick } = options const buttons = actions.map((action) => { - const href = actionHref(action, params, search) + const href = actionHref(action, params) return { icon: action.icon, label: action.label, diff --git a/src/frontend/components/app/records-table/record-in-list.tsx b/src/frontend/components/app/records-table/record-in-list.tsx index 0f1c8faec..6e3c5965e 100644 --- a/src/frontend/components/app/records-table/record-in-list.tsx +++ b/src/frontend/components/app/records-table/record-in-list.tsx @@ -4,7 +4,6 @@ import { Placeholder, TableRow, TableCell, CheckBox, ButtonGroup, } from '@admin-bro/design-system' -import { useLocation } from 'react-router' import PropertyType from '../../property-type' import { ActionJSON, buildActionClickHandler, RecordJSON, ResourceJSON } from '../../../interfaces' import { display } from './utils/display' @@ -29,7 +28,6 @@ export const RecordInList: React.FC = (props) => { } = props const [record, setRecord] = useState(recordFromProps) const history = useHistory() - const location = useLocation() const handleActionCallback = useCallback((actionResponse: ActionResponse) => { if (actionResponse.record && !actionResponse.redirectUrl) { @@ -62,7 +60,6 @@ export const RecordInList: React.FC = (props) => { action, params: { resourceId: resource.id, recordId: record.id }, actionResponseHandler, - search: location.search, push: history.push, })(event) } @@ -75,7 +72,6 @@ export const RecordInList: React.FC = (props) => { action: sourceAction, params: actionParams, actionResponseHandler, - search: location.search, push: history.push, })(event) ) @@ -88,7 +84,6 @@ export const RecordInList: React.FC = (props) => { buttons: actionsToButtonGroup({ actions: recordActions, params: actionParams, - search: location.search, handleClick: handleActionClick, }), }] diff --git a/src/frontend/components/app/records-table/selected-records.tsx b/src/frontend/components/app/records-table/selected-records.tsx index e3eaee84d..12f8d9a3f 100644 --- a/src/frontend/components/app/records-table/selected-records.tsx +++ b/src/frontend/components/app/records-table/selected-records.tsx @@ -1,10 +1,11 @@ import React from 'react' -import { TableCaption, Button, Icon, CardTitle } from '@admin-bro/design-system' +import { TableCaption, Title, ButtonGroup, Box } from '@admin-bro/design-system' -import { RecordJSON, ResourceJSON } from '../../../interfaces' -import ActionButton from '../action-button/action-button' +import { useHistory } from 'react-router' +import { ActionJSON, buildActionClickHandler, RecordJSON, ResourceJSON } from '../../../interfaces' import getBulkActionsFromRecords from './utils/get-bulk-actions-from-records' -import { useTranslation } from '../../../hooks' +import { useActionResponseHandler, useTranslation } from '../../../hooks' +import { actionsToButtonGroup } from '../action-header/actions-to-button-group' type SelectedRecordsProps = { resource: ResourceJSON; @@ -14,31 +15,38 @@ type SelectedRecordsProps = { export const SelectedRecords: React.FC = (props) => { const { resource, selectedRecords } = props const { translateLabel } = useTranslation() + const history = useHistory() + const actionResponseHandler = useActionResponseHandler() if (!selectedRecords || !selectedRecords.length) { return null } - const bulkActions = getBulkActionsFromRecords(selectedRecords) + const params = { resourceId: resource.id, recordIds: selectedRecords.map(records => records.id) } + + const handleActionClick = (event, sourceAction: ActionJSON): void => ( + buildActionClickHandler({ + action: sourceAction, + params, + actionResponseHandler, + push: history.push, + })(event) + ) + + const bulkButtons = actionsToButtonGroup({ + actions: getBulkActionsFromRecords(selectedRecords), + params, + handleClick: handleActionClick, + }) return ( - - {translateLabel('selectedRecords', resource.id, { selected: selectedRecords.length })} - - {bulkActions.map(action => ( - records.id)} - > - - - ))} + + + {translateLabel('selectedRecords', resource.id, { selected: selectedRecords.length })} + + + ) } diff --git a/src/frontend/hooks/use-action/use-action.ts b/src/frontend/hooks/use-action/use-action.ts index 1ada56ccf..4a0fe9724 100644 --- a/src/frontend/hooks/use-action/use-action.ts +++ b/src/frontend/hooks/use-action/use-action.ts @@ -1,4 +1,4 @@ -import { useLocation, useHistory } from 'react-router' +import { useHistory } from 'react-router' import { ActionResponse } from '../../../backend/actions/action.interface' @@ -25,25 +25,22 @@ export function useAction( params: DifferentActionParams, onActionCall?: ActionCallCallback, ): UseActionResult { - const location = useLocation() const history = useHistory() const actionResponseHandler = useActionResponseHandler(onActionCall) - const href = actionHref(action, params, location.search) + const href = actionHref(action, params) const callApi = buildActionCallApiTrigger({ action, params, actionResponseHandler, - search: location.search, }) const handleClick = buildActionClickHandler({ action, params, actionResponseHandler, - search: location.search, push: history.push, }) diff --git a/src/frontend/interfaces/action/action-href.ts b/src/frontend/interfaces/action/action-href.ts index 2c746a70b..9211e8d8d 100644 --- a/src/frontend/interfaces/action/action-href.ts +++ b/src/frontend/interfaces/action/action-href.ts @@ -7,7 +7,6 @@ const h = new ViewHelpers() export const actionHref = ( action: ActionJSON, params: DifferentActionParams, - search?: Location['search'], ): string | null => { const actionName = action.name @@ -19,17 +18,14 @@ export const actionHref = ( record: (): string => h.recordActionUrl({ ...params as RecordActionParams, actionName, - search, }), resource: (): string => h.resourceActionUrl({ resourceId: params.resourceId, actionName, - search, }), bulk: (): string => h.bulkActionUrl({ ...params, actionName, - search, }), } if (hrefMap[action.actionType]) { diff --git a/src/frontend/interfaces/action/build-action-click-handler.ts b/src/frontend/interfaces/action/build-action-click-handler.ts index 045ecfe6e..418b09871 100644 --- a/src/frontend/interfaces/action/build-action-click-handler.ts +++ b/src/frontend/interfaces/action/build-action-click-handler.ts @@ -12,7 +12,6 @@ export type BuildActionClickOptions = { params: DifferentActionParams; actionResponseHandler: ReturnType; push: (path: string, state?: any) => void; - search?: Location['search']; } export type BuildActionClickReturn = (event: any) => any @@ -20,16 +19,18 @@ export type BuildActionClickReturn = (event: any) => any export const buildActionClickHandler = ( options: BuildActionClickOptions, ): BuildActionClickReturn => { - const { action, params, actionResponseHandler, search, push } = options + const { action, params, actionResponseHandler, push } = options const handleActionClick = (event: React.MouseEvent): void => { event.preventDefault() event.stopPropagation() - const href = actionHref(action, params, search) + const href = actionHref(action, params) + + console.log({ href }) const callApi = buildActionCallApiTrigger({ - params, action, actionResponseHandler, search, + params, action, actionResponseHandler, }) if (action.guard && !confirm(action.guard)) {