feat: add an optional options object to the alert function

Author: atheck

README.md

@@ -160,7 +160,7 @@ To show an alert to the user, call the `alert` function. It has the following pa
 | Parameter | Required | Description |
 | --- | --- | --- |
 | message | yes | The message to display. |
-| severity | yes | The severity of the alert. |
+| severityOrOptions | yes | The severity of the alert or an options object. |
 
 ### Confirm
 

src/Component.tsx

@@ -6,7 +6,7 @@ interface State {
         isOpen: boolean,
         severity: Service.AlertSeverity,
         message: string,
-
+        duration?: number,
     },
     confirm: {
         isOpen: boolean,
@@ -127,7 +127,7 @@ class ConfirmComponentHost extends React.Component<Props, State> {
     public override render (): React.ReactNode {
         const { alert, confirm, choice } = this.state;
         const { renderAlert, renderConfirm, renderChoice, alertDurations } = this.props;
-        const autoHideDuration = alertDurations?.[alert.severity] ?? defaultDurations[alert.severity];
+        const autoHideDuration = alert.duration ?? alertDurations?.[alert.severity] ?? defaultDurations[alert.severity];
 
         return (
             <Fragment>
@@ -154,19 +154,20 @@ class ConfirmComponentHost extends React.Component<Props, State> {
         );
     }
 
-    private readonly showAlert = (message: string, severity: Service.AlertSeverity): void => {
+    private readonly showAlert = (message: string, severityOrOptions: Service.AlertSeverity | Service.AlertOptions): void => {
         const { alert } = this.state;
 
         if (alert.isOpen) {
             this.hideAlert();
 
-            setTimeout(() => this.showAlert(message, severity), 10);
+            setTimeout(() => this.showAlert(message, severityOrOptions), 10);
         } else {
             this.setState({
                 alert: {
                     isOpen: true,
                     message,
-                    severity,
+                    severity: typeof severityOrOptions === "string" ? severityOrOptions : severityOrOptions.severity,
+                    duration: typeof severityOrOptions === "string" ? undefined : severityOrOptions.duration,
                 },
             });
         }

src/Service.ts

@@ -1,8 +1,19 @@
 type AlertSeverity = "error" | "warning" | "info" | "success";
-type AlertFunc = (message: string, severity: AlertSeverity) => void;
+type AlertFunc = (message: string, severityOrOptions: AlertSeverity | AlertOptions) => void;
 type ConfirmFunc = (options: ConfirmOptions, callback: (result: boolean) => void) => void;
 type ChooseFunc = (props: ChooseOptions, callback: (result: Option | null) => void) => void;
 
+interface AlertOptions {
+    /**
+     * The severity of the alert.
+     */
+    severity: AlertSeverity,
+    /**
+     * The duration of the alert in milliseconds.
+     */
+    duration?: number,
+}
+
 interface ConfirmOptions {
     /**
      * The title of the confirmation.
@@ -80,16 +91,16 @@ const ConfirmService = {
     /**
      * Shows an alert.
      * @param message The message of the alert.
-     * @param severity The severity of the alert.
+     * @param severityOrOptions The severity of the alert or an options object.
      */
-    alert (this: void, message: string, severity: AlertSeverity): void {
+    alert (this: void, message: string, severityOrOptions: AlertSeverity | AlertOptions): void {
         const handlers = getCurrentHandlers();
 
         if (!handlers) {
             throw new Error("ConfirmService is not initialized.");
         }
 
-        handlers.alert(message, severity);
+        handlers.alert(message, severityOrOptions);
     },
     /**
      * Shows a confirmation.
@@ -144,6 +155,7 @@ const ConfirmService = {
 export type {
     AlertSeverity,
     Handlers,
+    AlertOptions,
     ConfirmOptions,
     Option,
     ChooseOptions,

tests/Service.spec.ts

@@ -1,4 +1,4 @@
-import { addHandlers, ChooseOptions, ConfirmOptions, ConfirmService, Handlers, Option, removeHandlers } from "../src/Service";
+import { addHandlers, AlertOptions, ChooseOptions, ConfirmOptions, ConfirmService, Handlers, Option, removeHandlers } from "../src/Service";
 
 describe("Service", () => {
     const mockAlert = jest.fn();
@@ -19,7 +19,8 @@ describe("Service", () => {
     });
 
     describe("alert", () => {
-        it("calls the provided alert function", () => {
+        it("calls the provided alert function with a severity", () => {
+            // arrange
             const message = "Message";
             const severity = "error";
 
@@ -31,6 +32,22 @@ describe("Service", () => {
             expect(mockAlert).toHaveBeenCalledWith(message, severity);
         });
 
+        it("calls the provided alert function with an options object", () => {
+            // arrange
+            const message = "Message";
+            const options: AlertOptions = {
+                severity: "error",
+                duration: 1000,
+            };
+
+            // act
+            ConfirmService.alert(message, options);
+
+            // assert
+            expect(alert.alert).toHaveBeenCalledTimes(1);
+            expect(mockAlert).toHaveBeenCalledWith(message, options);
+        });
+
         it("throws if not initialized", () => {
             // arrange
             removeHandlers(alert);