dce-reactkit 3.7.37 → 3.8.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dce-reactkit",
-  "version": "3.7.37",
+  "version": "3.8.0",
   "description": "Shared components for Harvard DCE apps",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",

package/src/components/Modal/index.tsx

@@ -255,6 +255,9 @@ const Modal: React.FC<ModalProps> = (props) => {
     onTopOfOtherModals,
   } = props;
 
+  // Determine if no header either
+  const noHeader = (!title && type === ModalType.NoButtons);
+
   /* -------------- State ------------- */
 
   // True if animation is in use
@@ -457,59 +460,61 @@ const Modal: React.FC<ModalProps> = (props) => {
             ),
           }}
         >
-          <div
-            className="modal-header"
-            style={{
-              color: (
-                isDarkModeOn()
-                  ? 'white'
-                  : undefined
-              ),
-              backgroundColor: (
-                isDarkModeOn()
-                  ? '#444'
-                  : undefined
-              ),
-              borderBottom: (
-                isDarkModeOn()
-                  ? '0.1rem solid gray'
-                  : undefined
-              ),
-            }}
-          >
-            <h5
-              className="modal-title"
+          {!noHeader && (
+            <div
+              className="modal-header"
               style={{
-                fontWeight: 'bold',
-                fontSize: (
-                  largeTitle
-                    ? '1.6rem'
+                color: (
+                  isDarkModeOn()
+                    ? 'white'
+                    : undefined
+                ),
+                backgroundColor: (
+                  isDarkModeOn()
+                    ? '#444'
+                    : undefined
+                ),
+                borderBottom: (
+                  isDarkModeOn()
+                    ? '0.1rem solid gray'
                     : undefined
                 ),
               }}
             >
-              {title}
-            </h5>
-
-            {(onClose && !dontShowXButton) && (
-              <button
-                type="button"
-                className="Modal-x-button btn-close"
-                aria-label="Close"
+              <h5
+                className="modal-title"
                 style={{
-                  backgroundColor: (
-                    isDarkModeOn()
-                      ? 'white'
+                  fontWeight: 'bold',
+                  fontSize: (
+                    largeTitle
+                      ? '1.6rem'
                       : undefined
                   ),
                 }}
-                onClick={() => {
-                  // Handle close
-                  handleClose(ModalButtonType.Cancel);
-                }}
-              />
-            )}
-          </div>
+              >
+                {title}
+              </h5>
+
+              {(onClose && !dontShowXButton) && (
+                <button
+                  type="button"
+                  className="Modal-x-button btn-close"
+                  aria-label="Close"
+                  style={{
+                    backgroundColor: (
+                      isDarkModeOn()
+                        ? 'white'
+                        : undefined
+                    ),
+                  }}
+                  onClick={() => {
+                    // Handle close
+                    handleClose(ModalButtonType.Cancel);
+                  }}
+                />
+              )}
+            </div>
+          )}
           {children && (
             <div
               className="modal-body"

package/src/helpers/visitServerEndpoint.tsx

@@ -129,12 +129,26 @@ const visitServerEndpoint = async (
     params = Object.fromEntries(
       Object
         .entries(opts.params)
-        .filter(([key, value]) => {
+        .filter(([, value]) => {
           return value !== undefined;
         }),
     );
   }
 
+  // Automatically JSONify arrays and objects
+  if (params) {
+    params = Object.fromEntries(
+      Object
+        .entries(params)
+        .map(([key, value]) => {
+          if (Array.isArray(value) || typeof value === 'object') {
+            return [key, JSON.stringify(value)];
+          }
+          return [key, value];
+        }),
+    );
+  }
+
   // Send the request
   const sendRequest = await getSendRequest();
   const response = await sendRequest({