Skip to content

Commit

Permalink
make actions menu dynamic
Browse files Browse the repository at this point in the history
  • Loading branch information
@rikukissa
rikukissa committed Dec 14, 2024
1 parent 3ac01b5 commit 68c34e3
Show file tree
Hide file tree
Showing 14 changed files with 186 additions and 70 deletions.
7 changes: 7 additions & 0 deletions packages/client/src/utils/userUtils.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import { createNamesMap } from './data-formatting'
import { LANG_EN } from './constants'
import { useSelector } from 'react-redux'
import { IStoreState } from '@client/store'
import { ITokenPayload } from './authUtils'

export const USER_DETAILS = 'USER_DETAILS'

Expand Down Expand Up @@ -54,6 +55,12 @@ export function getUserName(userDetails: UserDetails | null) {
)
}

export function useAuthentication() {
return useSelector<IStoreState, ITokenPayload | null>(
(state) => state.profile.tokenPayload
)
}

export function useUserName() {
return useSelector<IStoreState, string>((state) => {
const { userDetails } = state.profile
Expand Down
2 changes: 1 addition & 1 deletion packages/client/src/v2-events/features/events/EventSelection.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,7 @@ const EventSelector = () => {
clearForm()

navigate(
ROUTES.V2.EVENTS.DECLARE.EVENT.buildPath({
ROUTES.V2.EVENTS.DECLARE.buildPath({
eventId: transactionId
})
)
Expand Down
6 changes: 3 additions & 3 deletions packages/client/src/v2-events/features/events/actions/declare/Declare.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ function Declare() {

if (eventId !== event.id && !hasTemporaryId) {
navigate(
ROUTES.V2.EVENTS.DECLARE.EVENT.buildPath({
ROUTES.V2.EVENTS.DECLARE.buildPath({
eventId: event.id
})
)
Expand All @@ -89,7 +89,7 @@ function Declare() {
useEffect(() => {
if (!pageId) {
navigate(
ROUTES.V2.EVENTS.DECLARE.EVENT.PAGE.buildPath({
ROUTES.V2.EVENTS.DECLARE.PAGE.buildPath({
eventId: event.id,
pageId: pages[0].id
})
Expand All @@ -104,7 +104,7 @@ function Declare() {
const pageChanged = pages[currentPage].id !== pageId
if (pageChanged) {
navigate(
ROUTES.V2.EVENTS.DECLARE.EVENT.PAGE.buildPath({
ROUTES.V2.EVENTS.DECLARE.PAGE.buildPath({
eventId: event.id,
pageId: pages[currentPage].id
})
Expand Down
4 changes: 2 additions & 2 deletions packages/client/src/v2-events/features/events/actions/declare/Review.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -97,7 +97,7 @@ interface RejectionState {
}

export const ReviewSection = () => {
const { eventId } = useTypedParams(ROUTES.V2.EVENTS.DECLARE.EVENT.REVIEW)
const { eventId } = useTypedParams(ROUTES.V2.EVENTS.DECLARE.REVIEW)
const events = useEvents()
const navigate = useNavigate()
const [modal, openModal] = useModal()
Expand Down Expand Up @@ -133,7 +133,7 @@ export const ReviewSection = () => {

if (confirmedEdit) {
navigate(
ROUTES.V2.EVENTS.DECLARE.EVENT.PAGE.buildPath(
ROUTES.V2.EVENTS.DECLARE.PAGE.buildPath(
{ pageId, eventId },
{
from: 'review'
Expand Down
5 changes: 3 additions & 2 deletions packages/client/src/v2-events/features/events/actions/register/Register.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ const messages = defineMessages({
* Preview of event to be registered.
*/
export const RegisterIndex = () => {
const { eventId } = useTypedParams(ROUTES.V2.EVENTS.REGISTER.EVENT)
const { eventId } = useTypedParams(ROUTES.V2.EVENTS.REGISTER)
const events = useEvents()
const [modal, openModal] = useModal()
const navigate = useNavigate()
Expand Down Expand Up @@ -89,7 +89,7 @@ export const RegisterIndex = () => {

if (confirmedEdit) {
navigate(
ROUTES.V2.EVENTS.DECLARE.EVENT.PAGE.buildPath(
ROUTES.V2.EVENTS.DECLARE.PAGE.buildPath(
{ pageId, eventId },
{
from: 'register'
Expand Down Expand Up @@ -118,6 +118,7 @@ export const RegisterIndex = () => {

return (
<Preview.Body
title=""
formConfig={formConfigs[0]}
eventConfig={config}
onEdit={handleEdit}
Expand Down
2 changes: 1 addition & 1 deletion packages/client/src/v2-events/features/events/useEventFormNavigation.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ export const useEventFormNavigation = () => {
}

const goToReview = (eventId: string) => {
navigate(ROUTES.V2.EVENTS.DECLARE.EVENT.REVIEW.buildPath({ eventId }))
navigate(ROUTES.V2.EVENTS.DECLARE.REVIEW.buildPath({ eventId }))
}

const exit = async () => {
Expand Down
56 changes: 29 additions & 27 deletions packages/client/src/v2-events/features/workqueues/EventOverview/components/ActionMenu.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,26 +22,31 @@ import { ROUTES } from '@client/v2-events/routes'
import { useEventConfiguration } from '@client/v2-events/features/events/useEventConfiguration'
import { useEvents } from '@client/v2-events/features/events/useEvents/useEvents'
import { validate } from '@opencrvs/commons/client'
import { type ActionConfig } from '@opencrvs/commons'
import { useAuthentication } from '@client/utils/userUtils'

export const ActionMenu = ({ eventId }: { eventId: string }) => {
const intl = useIntl()
const events = useEvents()
const navigate = useNavigate()
const authentication = useAuthentication()
const [event] = events.getEvent(eventId)

const { eventConfiguration: configuration } = useEventConfiguration(
event.type
)

const registerActionConfiguration = configuration?.actions.find(
(action) => action.type === 'REGISTER'
)
const isActionVisible = (action: ActionConfig) => {
if (!action?.allowedWhen) {
return true
}
const params = {
$event: event,
$user: authentication
}

const registerActionShouldBeVisible =
!registerActionConfiguration?.allowedWhen
? true
: validate(registerActionConfiguration.allowedWhen, {
$event: event
})
return validate(action.allowedWhen, params)
}

return (
<>
Expand All @@ -52,26 +57,23 @@ export const ActionMenu = ({ eventId }: { eventId: string }) => {
</PrimaryButton>
</DropdownMenu.Trigger>
<DropdownMenu.Content>
{registerActionShouldBeVisible && (
<RegisterAction eventId={eventId} />
)}
{configuration?.actions.filter(isActionVisible).map((action) => (
<DropdownMenu.Item
key={action.type}
onClick={() => {
if (action.type === 'CREATE' || action.type === 'CUSTOM') {
alert(`Action ${action.type} is not implemented yet.`)
return
}

navigate(ROUTES.V2.EVENTS[action.type].buildPath({ eventId }))
}}
>
{intl.formatMessage(action.label)}
</DropdownMenu.Item>
))}
</DropdownMenu.Content>
</DropdownMenu>
</>
)
}

const RegisterAction = ({ eventId }: { eventId: string }) => {
const navigate = useNavigate()

return (
<DropdownMenu.Item
onClick={() => {
navigate(ROUTES.V2.EVENTS.REGISTER.EVENT.buildPath({ eventId }))
}}
>
<Icon name="CheckSquare" color="currentColor" size="large" />
Register
</DropdownMenu.Item>
)
}
8 changes: 4 additions & 4 deletions packages/client/src/v2-events/routes/config.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -69,19 +69,19 @@ export const routesConfig = {
element: <EventSelection />
},
{
path: ROUTES.V2.EVENTS.DECLARE.EVENT.REVIEW.path,
path: ROUTES.V2.EVENTS.DECLARE.REVIEW.path,
element: <ReviewSection />
},
{
path: ROUTES.V2.EVENTS.DECLARE.EVENT.path,
path: ROUTES.V2.EVENTS.DECLARE.path,
element: <DeclareIndex />
},
{
path: ROUTES.V2.EVENTS.DECLARE.EVENT.PAGE.path,
path: ROUTES.V2.EVENTS.DECLARE.PAGE.path,
element: <DeclareIndex />
},
{
path: ROUTES.V2.EVENTS.REGISTER.EVENT.path,
path: ROUTES.V2.EVENTS.REGISTER.path,
element: <RegisterIndex />
}
]
Expand Down
43 changes: 17 additions & 26 deletions packages/client/src/v2-events/routes/routes.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,36 +27,27 @@ export const ROUTES = {
}),
CREATE: route('create'),
DECLARE: route(
'declare',
{},
'declare/:eventId',
{
EVENT: route(
':eventId',
{
params: { eventId: string().defined() }
},
{
REVIEW: route('review'),
PAGE: route(':pageId', {
params: { pageId: string().defined() },
searchParams: {
from: string()
},
hash: hashValues()
})
}
)
}
),
REGISTER: route(
'register',
{},
params: { eventId: string().defined() }
},
{
EVENT: route(':eventId', {
params: { eventId: string().defined() }
REVIEW: route('review'),
PAGE: route(':pageId', {
params: { pageId: string().defined() },
searchParams: {
from: string()
},
hash: hashValues()
})
}
)
),
VALIDATE: route('validate/:eventId', {
params: { eventId: string().defined() }
}),
REGISTER: route('register/:eventId', {
params: { eventId: string().defined() }
})
}
),
WORKQUEUE: route('workqueue', {
Expand Down
21 changes: 19 additions & 2 deletions packages/commons/src/events/ActionConfig.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,8 @@ export const ActionType = {
CORRECT: 'CORRECT',
DETECT_DUPLICATE: 'DETECT_DUPLICATE',
NOTIFY: 'NOTIFY',
DECLARE: 'DECLARE'
DECLARE: 'DECLARE',
CUSTOM: 'CUSTOM'
} as const

const CreateConfig = ActionConfigBase.merge(
Expand All @@ -51,14 +52,30 @@ const DeclareConfig = ActionConfigBase.merge(
})
)

const ValidateConfig = ActionConfigBase.merge(
z.object({
type: z.literal(ActionType.VALIDATE)
})
)

const RegisterConfig = ActionConfigBase.merge(
z.object({
type: z.literal(ActionType.REGISTER)
})
)

const CustomConfig = ActionConfigBase.merge(
z.object({
type: z.literal(ActionType.CUSTOM)
})
)

export const ActionConfig = z.discriminatedUnion('type', [
CreateConfig,
DeclareConfig,
RegisterConfig
ValidateConfig,
RegisterConfig,
CustomConfig
])

export type ActionConfig = z.infer<typeof ActionConfig>
16 changes: 15 additions & 1 deletion packages/commons/src/events/ActionDocument.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,12 @@ const DeclareAction = ActionBase.merge(
})
)

const ValidateAction = ActionBase.merge(
z.object({
type: z.literal(ActionType.VALIDATE)
})
)

const DraftAction = ActionBase.merge(
z.object({
type: z.literal(ActionType.DRAFT)
Expand All @@ -66,14 +72,22 @@ const NotifiedAction = ActionBase.merge(
})
)

const CustomAction = ActionBase.merge(
z.object({
type: z.literal(ActionType.CUSTOM)
})
)

export const ActionDocument = z.discriminatedUnion('type', [
CreatedAction,
DraftAction,
ValidateAction,
NotifiedAction,
RegisterAction,
DeclareAction,
AssignedAction,
UnassignedAction
UnassignedAction,
CustomAction
])

export type ActionDocument = z.infer<typeof ActionDocument>
Expand Down
7 changes: 7 additions & 0 deletions packages/commons/src/events/ActionInput.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,12 @@ export const RegisterActionInput = BaseActionInput.merge(
})
)

export const ValidateActionInput = BaseActionInput.merge(
z.object({
type: z.literal(ActionType.VALIDATE).default(ActionType.VALIDATE)
})
)

export const NotifyActionInput = BaseActionInput.merge(
z.object({
type: z.literal(ActionType.NOTIFY).default(ActionType.NOTIFY),
Expand Down Expand Up @@ -72,6 +78,7 @@ const UnassignActionInput = BaseActionInput.merge(

export const ActionInput = z.discriminatedUnion('type', [
CreateActionInput,
ValidateActionInput,
DraftActionInput,
RegisterActionInput,
NotifyActionInput,
Expand Down
Loading

0 comments on commit 68c34e3

Please sign in to comment.