@evenicanpm/admin-integrate 1.2.2 → 1.3.0

package/src/components/scheduler/day-tag.tsx

@@ -1,22 +1,8 @@
-import React from "react";
+import { StatusTag } from "@evenicanpm/admin-integrate/components/core";
+import type { SxProps } from "@mui/material";
 import { useTranslations } from "next-intl";
 
-import { styled } from "@mui/material/styles";
-import { Box, Typography, SxProps } from "@mui/material";
-
-import { DayString } from "./scheduler-types";
-
-// Styled components
-const StyledTagBox = styled(Box)(({ theme }) => ({
-	padding: theme.spacing(0, 1.5),
-	border: "solid 1px",
-	borderRadius: 4,
-	alignContent: "center",
-	maxWidth: "fit-content",
-}));
-const StyledTag = styled(Typography)(() => ({
-	fontWeight: "bold",
-}));
+import type { DayString } from "./scheduler-types";
 
 interface Props {
 	day: DayString;
@@ -28,45 +14,22 @@ const DayTag: React.FC<Props> = (props: Props) => {
 
 	if (props.day === "disabled") {
 		return (
-			<StyledTagBox
-				sx={{
-					backgroundColor: "grey.300",
-					borderColor: "grey.600",
-					color: "grey.600",
-					...props.sx,
-				}}
-			>
-				<StyledTag color="grey" variant="caption">
-					{t("Scheduler.disabled")}
-				</StyledTag>
-			</StyledTagBox>
+			<StatusTag
+				type="unavailable"
+				text={t("Scheduler.disabled")}
+				sx={props.sx}
+			/>
 		);
 	}
 
 	return props.day === "everyday" ? (
-		<StyledTagBox
-			sx={{
-				backgroundColor: "success.100",
-				borderColor: "success.main",
-				...props.sx,
-			}}
-		>
-			<StyledTag color="success" variant="caption">
-				{t("Scheduler.everyday")}
-			</StyledTag>
-		</StyledTagBox>
+		<StatusTag type="success" text={t("Scheduler.everyday")} sx={props.sx} />
 	) : (
-		<StyledTagBox
-			sx={{
-				backgroundColor: "info.100",
-				borderColor: "info.main",
-				...props.sx,
-			}}
-		>
-			<StyledTag color="info" variant="caption">
-				{t(`Scheduler.${props.day}Short`)}
-			</StyledTag>
-		</StyledTagBox>
+		<StatusTag
+			type="info"
+			text={t(`Scheduler.${props.day}Short`)}
+			sx={props.sx}
+		/>
 	);
 };
 

package/src/components/scheduler/index.ts

@@ -1,4 +1,5 @@
+export { default as DaySelector } from "./day-selector";
 export { default as DayTag } from "./day-tag";
 export { default as ScheduleIcon } from "./schedule-icon";
-export { default as DaySelector } from "./day-selector";
+export { default as ScheduleIntegrationIcon } from "./schedule-integration-icon";
 export * from "./scheduler-types";

package/src/components/scheduler/schedule-drawer/details-reducer.ts

@@ -0,0 +1,217 @@
+import type {
+	ProcessScheduleGroupDetailsProcessInput,
+	ProcessScheduleGroupDetailsUpdate,
+} from "@evenicanpm/admin-core/api/e4/graphqlRequestSdk";
+import type { IsDay } from "@evenicanpm/admin-integrate/components/scheduler";
+
+export interface DefaultScheduledProcess {
+	id: string;
+	name: string;
+	processIcon: string;
+}
+
+export enum DetailsActionType {
+	INIT = "INIT",
+	CLOSE = "CLOSE",
+	EDIT_NAME = "EDIT_NAME",
+	TOGGLE_ENABLED = "TOGGLE_ENABLED",
+	EDIT_DAYS = "EDIT_DAYS",
+	EDIT_START_DATE = "EDIT_START_DATE",
+	EDIT_RECURRENCE = "EDIT_RECURRENCE",
+	EDIT_INTEGRATIONS = "EDIT_INTEGRATIONS",
+	INIT_BLANK = "INIT_BLANK",
+	SET_ERRORS = "SET_ERRORS",
+	SET_DEFAULT_SCHEDULED_PROCESS = "SET_DEFAULT_SCHEDULED_PROCESS",
+}
+
+export interface DetailsAction {
+	type: DetailsActionType;
+}
+
+export interface InitAction extends DetailsAction {
+	details: ProcessScheduleGroupDetailsUpdate;
+}
+
+export interface EditNameAction extends DetailsAction {
+	name: string;
+}
+
+export interface EditDaysAction extends DetailsAction {
+	isDay: IsDay;
+}
+
+export interface EditStartDateAction extends DetailsAction {
+	startDate: string;
+}
+
+export interface EditRecurrenceAction extends DetailsAction {
+	interval?: number;
+	intervalUnitId?: string;
+}
+
+export interface EditIntegrationsAction extends DetailsAction {
+	processes: ProcessScheduleGroupDetailsProcessInput[];
+}
+
+export interface SetErrorsAction extends DetailsAction {
+	errors: ErrorsState;
+}
+
+export interface SetDefaultScheduledProcessAction extends DetailsAction {
+	defaultScheduledProcess: DefaultScheduledProcess;
+}
+
+export interface ErrorsState {
+	name?: boolean;
+	startDate?: boolean;
+	interval?: boolean;
+	processes?: boolean;
+}
+
+export interface DetailsState {
+	details: ProcessScheduleGroupDetailsUpdate | null;
+	errors?: ErrorsState;
+	defaultScheduledProcess?: DefaultScheduledProcess;
+}
+
+export function detailsReducer(
+	state: DetailsState,
+	action: DetailsAction,
+): DetailsState {
+	switch (action.type) {
+		case DetailsActionType.INIT: {
+			const { details } = action as InitAction;
+			return {
+				...state,
+				details,
+				errors: {
+					name: !details.name || details.name === "",
+					startDate: !details.startDate,
+					interval: !details.interval,
+					processes: !details.processes || details.processes.length === 0,
+				},
+			};
+		}
+		case DetailsActionType.INIT_BLANK: {
+			const blankState: ProcessScheduleGroupDetailsUpdate = {
+				id: "",
+				name: "",
+				code: "",
+				isDisabled: false,
+				interval: 5,
+				intervalUnitId: "1",
+				startDate: new Date().toISOString(),
+				processes: [],
+			};
+			return {
+				...state,
+				details: blankState,
+				errors: {
+					name: !blankState.name || blankState.name === "",
+					processes: !blankState.processes || blankState.processes.length === 0,
+				},
+			};
+		}
+		case DetailsActionType.CLOSE: {
+			return { details: null };
+		}
+		case DetailsActionType.EDIT_NAME: {
+			if (!state.details) return state;
+
+			const { name } = action as EditNameAction;
+			const code = name.replaceAll(" ", "_").toLowerCase();
+			return {
+				...state,
+				details: {
+					...state.details,
+					name,
+					code,
+				},
+			};
+		}
+		case DetailsActionType.TOGGLE_ENABLED: {
+			if (!state.details) return state;
+
+			return {
+				...state,
+				details: {
+					...state.details,
+					isDisabled: !state.details.isDisabled,
+				},
+			};
+		}
+		case DetailsActionType.EDIT_DAYS: {
+			if (!state.details) return state;
+
+			const { isDay } = action as EditDaysAction;
+			return {
+				...state,
+				details: {
+					...state.details,
+					...isDay,
+				},
+			};
+		}
+		case DetailsActionType.EDIT_START_DATE: {
+			if (!state.details) return state;
+
+			const { startDate } = action as EditStartDateAction;
+			return {
+				...state,
+				details: {
+					...state.details,
+					startDate,
+				},
+			};
+		}
+		case DetailsActionType.EDIT_RECURRENCE: {
+			if (!state.details) return state;
+
+			const { interval, intervalUnitId } = action as EditRecurrenceAction;
+			return {
+				...state,
+				details: {
+					...state.details,
+					...(interval !== undefined && { interval }),
+					...(intervalUnitId !== undefined && { intervalUnitId }),
+				},
+			};
+		}
+		case DetailsActionType.EDIT_INTEGRATIONS: {
+			if (!state.details) return state;
+
+			const { processes } = action as EditIntegrationsAction;
+			return {
+				...state,
+				details: {
+					...state.details,
+					processes: processes,
+				},
+			};
+		}
+		case DetailsActionType.SET_DEFAULT_SCHEDULED_PROCESS: {
+			const { defaultScheduledProcess } =
+				action as SetDefaultScheduledProcessAction;
+			return {
+				...state,
+				defaultScheduledProcess: defaultScheduledProcess,
+			};
+		}
+		case DetailsActionType.SET_ERRORS: {
+			if (!state.details) return state;
+
+			const { errors } = action as SetErrorsAction;
+			return {
+				...state,
+				errors: {
+					...state.errors,
+					...errors,
+				},
+			};
+		}
+		default: {
+			console.error(`${action.type} is not a valid action for detailsReducer`);
+			return state;
+		}
+	}
+}