mirror of
				https://github.com/Unleash/unleash.git
				synced 2025-10-27 11:02:16 +01:00 
			
		
		
		
	chore: add new action hooks (#5992)
https://linear.app/unleash/issue/2-1857/create-new-action-hooks-on-the-frontend Adds action hooks to help us with CRUD operations on the frontend, similar to https://github.com/Unleash/unleash/pull/5788 and https://github.com/Unleash/unleash/pull/5790
This commit is contained in:
		
							parent
							
								
									b6a219dd36
								
							
						
					
					
						commit
						0847c2e52c
					
				| @ -0,0 +1,73 @@ | |||||||
|  | import { IAction, IActionSet } from 'interfaces/action'; | ||||||
|  | import useAPI from '../useApi/useApi'; | ||||||
|  | 
 | ||||||
|  | const ENDPOINT = 'api/admin/actions'; | ||||||
|  | 
 | ||||||
|  | export type ActionPayload = Omit< | ||||||
|  |     IAction, | ||||||
|  |     'id' | 'createdAt' | 'createdByUserId' | ||||||
|  | >; | ||||||
|  | 
 | ||||||
|  | export type ActionSetPayload = Omit< | ||||||
|  |     IActionSet, | ||||||
|  |     'id' | 'createdAt' | 'createdByUserId' | ||||||
|  | > & { | ||||||
|  |     actions: ActionPayload[]; | ||||||
|  | }; | ||||||
|  | 
 | ||||||
|  | export const useActionsApi = () => { | ||||||
|  |     const { loading, makeRequest, createRequest, errors } = useAPI({ | ||||||
|  |         propagateErrors: true, | ||||||
|  |     }); | ||||||
|  | 
 | ||||||
|  |     const addActionSet = async (actionSet: ActionSetPayload) => { | ||||||
|  |         const requestId = 'addActionSet'; | ||||||
|  |         const req = createRequest( | ||||||
|  |             ENDPOINT, | ||||||
|  |             { | ||||||
|  |                 method: 'POST', | ||||||
|  |                 body: JSON.stringify(actionSet), | ||||||
|  |             }, | ||||||
|  |             requestId, | ||||||
|  |         ); | ||||||
|  | 
 | ||||||
|  |         const response = await makeRequest(req.caller, req.id); | ||||||
|  |         return response.json(); | ||||||
|  |     }; | ||||||
|  | 
 | ||||||
|  |     const updateActionSet = async ( | ||||||
|  |         actionSetId: number, | ||||||
|  |         actionSet: ActionSetPayload, | ||||||
|  |     ) => { | ||||||
|  |         const requestId = 'updateActionSet'; | ||||||
|  |         const req = createRequest( | ||||||
|  |             `${ENDPOINT}/${actionSetId}`, | ||||||
|  |             { | ||||||
|  |                 method: 'PUT', | ||||||
|  |                 body: JSON.stringify(actionSet), | ||||||
|  |             }, | ||||||
|  |             requestId, | ||||||
|  |         ); | ||||||
|  | 
 | ||||||
|  |         await makeRequest(req.caller, req.id); | ||||||
|  |     }; | ||||||
|  | 
 | ||||||
|  |     const removeActionSet = async (actionSetId: number) => { | ||||||
|  |         const requestId = 'removeActionSet'; | ||||||
|  |         const req = createRequest( | ||||||
|  |             `${ENDPOINT}/${actionSetId}`, | ||||||
|  |             { method: 'DELETE' }, | ||||||
|  |             requestId, | ||||||
|  |         ); | ||||||
|  | 
 | ||||||
|  |         await makeRequest(req.caller, req.id); | ||||||
|  |     }; | ||||||
|  | 
 | ||||||
|  |     return { | ||||||
|  |         addActionSet, | ||||||
|  |         updateActionSet, | ||||||
|  |         removeActionSet, | ||||||
|  |         errors, | ||||||
|  |         loading, | ||||||
|  |     }; | ||||||
|  | }; | ||||||
							
								
								
									
										37
									
								
								frontend/src/hooks/api/getters/useActions/useActions.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										37
									
								
								frontend/src/hooks/api/getters/useActions/useActions.ts
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,37 @@ | |||||||
|  | import { useMemo } from 'react'; | ||||||
|  | import { formatApiPath } from 'utils/formatPath'; | ||||||
|  | import handleErrorResponses from '../httpErrorResponseHandler'; | ||||||
|  | import { useConditionalSWR } from '../useConditionalSWR/useConditionalSWR'; | ||||||
|  | import useUiConfig from '../useUiConfig/useUiConfig'; | ||||||
|  | import { IActionSet } from 'interfaces/action'; | ||||||
|  | import { useUiFlag } from 'hooks/useUiFlag'; | ||||||
|  | 
 | ||||||
|  | const ENDPOINT = 'api/admin/actions'; | ||||||
|  | 
 | ||||||
|  | export const useActions = () => { | ||||||
|  |     const { isEnterprise } = useUiConfig(); | ||||||
|  |     const actionsEnabled = useUiFlag('automatedActions'); | ||||||
|  | 
 | ||||||
|  |     const { data, error, mutate } = useConditionalSWR( | ||||||
|  |         isEnterprise() && actionsEnabled, | ||||||
|  |         { actions: [] }, | ||||||
|  |         formatApiPath(ENDPOINT), | ||||||
|  |         fetcher, | ||||||
|  |     ); | ||||||
|  | 
 | ||||||
|  |     return useMemo( | ||||||
|  |         () => ({ | ||||||
|  |             actions: (data?.actions ?? []) as IActionSet[], | ||||||
|  |             loading: !error && !data, | ||||||
|  |             refetch: () => mutate(), | ||||||
|  |             error, | ||||||
|  |         }), | ||||||
|  |         [data, error, mutate], | ||||||
|  |     ); | ||||||
|  | }; | ||||||
|  | 
 | ||||||
|  | const fetcher = (path: string) => { | ||||||
|  |     return fetch(path) | ||||||
|  |         .then(handleErrorResponses('Actions')) | ||||||
|  |         .then((res) => res.json()); | ||||||
|  | }; | ||||||
							
								
								
									
										27
									
								
								frontend/src/interfaces/action.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										27
									
								
								frontend/src/interfaces/action.ts
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,27 @@ | |||||||
|  | export interface IActionSet { | ||||||
|  |     id: number; | ||||||
|  |     name: string; | ||||||
|  |     project: string; | ||||||
|  |     actorId: number; | ||||||
|  |     match: IMatch; | ||||||
|  |     actions: IAction[]; | ||||||
|  |     createdAt: string; | ||||||
|  |     createdByUserId: number; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | type MatchSource = 'incoming-webhook'; | ||||||
|  | 
 | ||||||
|  | export interface IMatch { | ||||||
|  |     source: MatchSource; | ||||||
|  |     sourceId: number; | ||||||
|  |     payload: Record<string, unknown>; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | export interface IAction { | ||||||
|  |     id: number; | ||||||
|  |     action: string; | ||||||
|  |     sortOrder: number; | ||||||
|  |     executionParams: Record<string, unknown>; | ||||||
|  |     createdAt: string; | ||||||
|  |     createdByUserId: number; | ||||||
|  | } | ||||||
| @ -68,6 +68,7 @@ export type UiFlags = { | |||||||
|     featureSearchFrontend?: boolean; |     featureSearchFrontend?: boolean; | ||||||
|     newStrategyConfiguration?: boolean; |     newStrategyConfiguration?: boolean; | ||||||
|     incomingWebhooks?: boolean; |     incomingWebhooks?: boolean; | ||||||
|  |     automatedActions?: boolean; | ||||||
|     celebrateUnleash?: boolean; |     celebrateUnleash?: boolean; | ||||||
|     increaseUnleashWidth?: boolean; |     increaseUnleashWidth?: boolean; | ||||||
|     featureSearchFeedback?: boolean; |     featureSearchFeedback?: boolean; | ||||||
|  | |||||||
		Loading…
	
		Reference in New Issue
	
	Block a user