admin_lsac 1.2.7 → 1.2.9

package/dist/App.js

@@ -5,8 +5,8 @@ var react_1 = require("@chakra-ui/react");
 var react_router_dom_1 = require("react-router-dom");
 var Page_1 = require("./components/Page");
 var Page_2 = require("./components/Page");
-function AdminPanel(_a) {
+function App(_a) {
     var pages = _a.pages, basePath = _a.basePath;
-    return ((0, jsx_runtime_1.jsx)(react_1.ChakraProvider, { children: (0, jsx_runtime_1.jsx)(react_router_dom_1.BrowserRouter, { children: (0, jsx_runtime_1.jsxs)(react_router_dom_1.Routes, { children: [pages.map(function (page) { return ((0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "".concat(basePath, "/").concat((0, Page_2.pageToUrl)(page)), element: (0, jsx_runtime_1.jsx)(Page_1.AdminPage, { pages: pages, selectedPage: page, basePath: basePath }) })); }), pages[0] ? ((0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "".concat(basePath, "/*"), element: (0, jsx_runtime_1.jsx)(Page_1.AdminPage, { pages: pages, selectedPage: pages[0], basePath: basePath }) })) : null] }) }) }));
+    return ((0, jsx_runtime_1.jsx)(react_1.ChakraProvider, { children: (0, jsx_runtime_1.jsx)(react_router_dom_1.BrowserRouter, { children: (0, jsx_runtime_1.jsxs)(react_router_dom_1.Routes, { children: [pages.map(function (page) { return ((0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "".concat(basePath, "/").concat((0, Page_2.pageToUrl)(page)), element: (0, jsx_runtime_1.jsx)(Page_1.AdminPage, { pages: pages, selectedPage: page, basePath: basePath, apiURL: "http://localhost:3001" }) })); }), pages[0] ? ((0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "".concat(basePath, "/*"), element: (0, jsx_runtime_1.jsx)(Page_1.AdminPage, { pages: pages, selectedPage: pages[0], basePath: basePath, apiURL: "http://localhost:3001" }) })) : null] }) }) }));
 }
-exports.default = AdminPanel;
+exports.default = App;

package/dist/cjs/App.js

@@ -5,8 +5,8 @@ var react_1 = require("@chakra-ui/react");
 var react_router_dom_1 = require("react-router-dom");
 var Page_1 = require("./components/Page");
 var Page_2 = require("./components/Page");
-function AdminPanel(_a) {
+function App(_a) {
     var pages = _a.pages, basePath = _a.basePath;
-    return ((0, jsx_runtime_1.jsx)(react_1.ChakraProvider, { children: (0, jsx_runtime_1.jsx)(react_router_dom_1.BrowserRouter, { children: (0, jsx_runtime_1.jsxs)(react_router_dom_1.Routes, { children: [pages.map(function (page) { return ((0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "".concat(basePath, "/").concat((0, Page_2.pageToUrl)(page)), element: (0, jsx_runtime_1.jsx)(Page_1.AdminPage, { pages: pages, selectedPage: page, basePath: basePath }) })); }), pages[0] ? ((0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "".concat(basePath, "/*"), element: (0, jsx_runtime_1.jsx)(Page_1.AdminPage, { pages: pages, selectedPage: pages[0], basePath: basePath }) })) : null] }) }) }));
+    return ((0, jsx_runtime_1.jsx)(react_1.ChakraProvider, { children: (0, jsx_runtime_1.jsx)(react_router_dom_1.BrowserRouter, { children: (0, jsx_runtime_1.jsxs)(react_router_dom_1.Routes, { children: [pages.map(function (page) { return ((0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "".concat(basePath, "/").concat((0, Page_2.pageToUrl)(page)), element: (0, jsx_runtime_1.jsx)(Page_1.AdminPage, { pages: pages, selectedPage: page, basePath: basePath, apiURL: "http://localhost:3001" }) })); }), pages[0] ? ((0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "".concat(basePath, "/*"), element: (0, jsx_runtime_1.jsx)(Page_1.AdminPage, { pages: pages, selectedPage: pages[0], basePath: basePath, apiURL: "http://localhost:3001" }) })) : null] }) }) }));
 }
-exports.default = AdminPanel;
+exports.default = App;

package/dist/cjs/components/GenericForm.js

@@ -140,10 +140,10 @@ function parseFields(fields, previous) {
                                                 : generateSingleField(formfield.element, "".concat(fieldName, ".").concat(index), key) }), (0, jsx_runtime_1.jsxs)(react_1.Button, { type: "button", colorScheme: "red", marginY: 2, onClick: function () { return remove(index); }, children: ["Remove ", "".concat(fieldName, ".").concat(index)] })] })); }), (0, jsx_runtime_1.jsxs)(react_1.Button, { type: "button", marginY: 2, colorScheme: "blue", onClick: function () {
                                     var value = undefined;
                                     if (formfield.element.type === "object") {
-                                        value = getInitialValues(formfield.element.fields);
+                                        value = getCustomInitialValues(formfield.element.fields);
                                     }
                                     else {
-                                        value = getInitialValues([formfield.element])[0];
+                                        value = getCustomInitialValues([formfield.element])[0];
                                     }
                                     push(value);
                                 }, children: ["Add ", fieldName] })] }));
@@ -155,7 +155,7 @@ function parseFields(fields, previous) {
     });
     return computedFields;
 }
-function getInitialValues(fields) {
+function getCustomInitialValues(fields) {
     var obj = {};
     if (!fields) {
         return obj;
@@ -164,7 +164,7 @@ function getInitialValues(fields) {
         if (field.type === "array")
             obj[field.name] = [];
         else if (field.type === "object")
-            obj[field.name] = getInitialValues(field.fields);
+            obj[field.name] = getCustomInitialValues(field.fields);
         else if (field.type === "string")
             obj[field.name] = "";
         else if (field.type === "number")
@@ -174,6 +174,25 @@ function getInitialValues(fields) {
     });
     return obj;
 }
+function getInitialValues(action, rowId) {
+    return __awaiter(this, void 0, void 0, function () {
+        var obj, customInitialValues;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    obj = {};
+                    if (!action.initialise) return [3 /*break*/, 2];
+                    return [4 /*yield*/, action.initialise(rowId)];
+                case 1:
+                    obj = _a.sent();
+                    _a.label = 2;
+                case 2:
+                    customInitialValues = getCustomInitialValues(action.fields);
+                    return [2 /*return*/, Object.assign({}, customInitialValues, obj)];
+            }
+        });
+    });
+}
 function setOptions(fields) {
     return __awaiter(this, void 0, void 0, function () {
         var promises;
@@ -223,16 +242,29 @@ function GenericForm(_a) {
     var _this = this;
     var action = _a.action, onClose = _a.onClose, rowId = _a.rowId;
     var _b = (0, react_2.useState)(parseFields(action.fields)), formFields = _b[0], setFormFields = _b[1];
-    var initialValues = (0, react_2.useState)(getInitialValues(action.fields))[0];
-    var validationSchema = (0, react_2.useState)(parseValidation(action.fields))[0];
+    var _c = (0, react_2.useState)(getCustomInitialValues(action.fields)), initialValues = _c[0], setInitialValues = _c[1];
+    var _d = (0, react_2.useState)(parseValidation(action.fields)), validationSchema = _d[0], setValidationSchema = _d[1];
     (0, react_2.useEffect)(function () {
         setOptions(action.fields).then(function () {
             setFormFields(parseFields(action.fields));
         });
     }, []);
+    var handleFormReset = function () { return __awaiter(_this, void 0, void 0, function () {
+        var newInitialValues;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0: return [4 /*yield*/, getInitialValues(action, rowId)];
+                case 1:
+                    newInitialValues = _a.sent();
+                    console.log(newInitialValues);
+                    setInitialValues(newInitialValues);
+                    return [2 /*return*/];
+            }
+        });
+    }); };
     if (!action.fields)
         return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(formik_1.Formik, { initialValues: initialValues, validationSchema: Yup.object(validationSchema), onSubmit: function (values) { return __awaiter(_this, void 0, void 0, function () {
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(formik_1.Formik, { enableReinitialize: true, initialValues: initialValues, validationSchema: Yup.object(validationSchema), onReset: handleFormReset, onSubmit: function (values) { return __awaiter(_this, void 0, void 0, function () {
                 var res, e_1, err;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
@@ -267,7 +299,7 @@ function GenericForm(_a) {
                 });
             }); }, children: function (_a) {
                 var isSubmitting = _a.isSubmitting;
-                return ((0, jsx_runtime_1.jsxs)(formik_1.Form, { children: [formFields, (0, jsx_runtime_1.jsx)(react_1.Button, { mt: 4, colorScheme: "teal", isLoading: isSubmitting, type: "submit", children: "Submit" })] }));
+                return ((0, jsx_runtime_1.jsxs)(formik_1.Form, { children: [formFields, (0, jsx_runtime_1.jsx)(react_1.Button, { mt: 4, colorScheme: "teal", isLoading: isSubmitting, type: "submit", children: "Submit" }), (0, jsx_runtime_1.jsx)(react_1.Button, { mt: 4, colorScheme: "teal", type: "reset", children: "Initialise Form" })] }));
             } }) }));
 }
 exports.GenericForm = GenericForm;

package/dist/cjs/components/Page.js

@@ -15,6 +15,8 @@ var material_react_table_1 = require("material-react-table");
 var export_to_csv_1 = require("export-to-csv");
 var sweetalert2_1 = __importDefault(require("sweetalert2"));
 var MenuItem_1 = __importDefault(require("@mui/material/MenuItem"));
+var socket_io_client_1 = require("socket.io-client");
+var websockets_1 = require("../utils/websockets");
 function pageToUrl(page) {
     return "".concat(page.name.toLowerCase().replace(" ", "_"));
 }
@@ -63,17 +65,31 @@ function exportToCSV(data, filename) {
 }
 function AdminPage(_a) {
     var _b;
-    var pages = _a.pages, selectedPage = _a.selectedPage, basePath = _a.basePath;
-    var _c = (0, react_3.useDisclosure)(), isOpen = _c.isOpen, onOpen = _c.onOpen, onClose = _c.onClose;
-    var _d = (0, react_1.useState)({}), selectedAction = _d[0], setSelectedAction = _d[1];
-    var _e = (0, react_1.useState)([]), data = _e[0], setData = _e[1];
-    var _f = (0, react_1.useState)([]), displayData = _f[0], setDisplayData = _f[1];
-    var _g = (0, react_1.useState)(), rowId = _g[0], setRowId = _g[1];
+    var pages = _a.pages, selectedPage = _a.selectedPage, basePath = _a.basePath, _c = _a.apiURL, apiURL = _c === void 0 ? '' : _c;
+    var _d = (0, react_3.useDisclosure)(), isOpen = _d.isOpen, onOpen = _d.onOpen, onClose = _d.onClose;
+    var _e = (0, react_1.useState)({}), selectedAction = _e[0], setSelectedAction = _e[1];
+    var _f = (0, react_1.useState)([]), data = _f[0], setData = _f[1];
+    var _g = (0, react_1.useState)([]), displayData = _g[0], setDisplayData = _g[1];
+    var _h = (0, react_1.useState)(), rowId = _h[0], setRowId = _h[1];
+    var _j = (0, react_1.useState)(false), refetch = _j[0], setRefetch = _j[1];
+    var _k = (0, react_1.useState)(socket_io_client_1.io), socket = _k[0], setSocket = _k[1];
+    (0, websockets_1.newSocket)(setSocket, apiURL);
     (0, react_1.useEffect)(function () {
         selectedPage.getRequest().then(function (resArray) {
             setData(resArray);
+            setRefetch(false);
         });
-    }, []);
+    }, [refetch]); // Do not remove 'refetch' from here !!!
+    (0, react_1.useEffect)(function () {
+        socket.on("updateData", function (message) {
+            console.log("Message emitted from socket: " + message);
+            setRefetch(true);
+            var rowActionsMenu = document.querySelector(".MuiPaper-root.MuiPopover-paper.MuiMenu-paper");
+            if (rowActionsMenu) {
+                rowActionsMenu.remove();
+            }
+        });
+    }, [socket, selectedPage]);
     (0, react_1.useEffect)(function () {
         setDisplayData(data.map(function (table_data) {
             return selectedPage.tableFields.map(function (field) { return field.access(table_data); });
@@ -98,7 +114,6 @@ function AdminPage(_a) {
                     } }) }), (0, jsx_runtime_1.jsxs)(react_3.Modal, { size: "6xl", isOpen: isOpen, onClose: onClose, children: [(0, jsx_runtime_1.jsx)(react_3.ModalOverlay, {}), (0, jsx_runtime_1.jsxs)(react_3.ModalContent, { children: [(0, jsx_runtime_1.jsx)(react_3.ModalHeader, { children: selectedAction.name }), (0, jsx_runtime_1.jsx)(react_3.ModalCloseButton, {}), (0, jsx_runtime_1.jsxs)(react_3.ModalBody, { children: [selectedAction.fields && ((_b = selectedAction.fields) === null || _b === void 0 ? void 0 : _b.length) > 0 ? ((0, jsx_runtime_1.jsx)(GenericForm_1.GenericForm, { action: selectedAction, onClose: onClose, rowId: rowId })) : ((0, jsx_runtime_1.jsx)(react_3.Button, { colorScheme: "blue", mr: 3, onClick: function () {
                                             selectedAction.onSubmit(rowId);
                                             onClose();
-                                            window.location.reload();
                                         }, children: "Confirm Action" })), (0, jsx_runtime_1.jsx)(react_3.Button, { colorScheme: "red", mr: 3, onClick: onClose, children: "Close" })] })] })] })] }));
 }
 exports.AdminPage = AdminPage;

package/dist/cjs/index.js

@@ -9,9 +9,9 @@ var client_1 = __importDefault(require("react-dom/client"));
 require("./index.css");
 var App_1 = __importDefault(require("./App"));
 var reportWebVitals_1 = __importDefault(require("./reportWebVitals"));
-var event_1 = require("./pages/event");
+var schema_config_1 = require("./schema/schema.config");
 var root = client_1.default.createRoot(document.getElementById("root"));
-root.render((0, jsx_runtime_1.jsx)(react_1.default.StrictMode, { children: (0, jsx_runtime_1.jsx)(App_1.default, { pages: [event_1.event], basePath: "" }) }));
+root.render((0, jsx_runtime_1.jsx)(react_1.default.StrictMode, { children: (0, jsx_runtime_1.jsx)(App_1.default, { pages: schema_config_1.pages, basePath: "" }) }));
 // If you want to start measuring performance in your app, pass a function
 // to log results (for example: reportWebVitals(console.log))
 // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals

package/dist/cjs/pages/event.js

@@ -45,7 +45,31 @@ var domain = "http://localhost:3001";
 exports.event = {
     name: "Events",
     actions: [],
-    rowActions: [],
+    rowActions: [
+    //   {
+    //   name: "Delete Event",
+    //   fields: [
+    //     {
+    //       name: "input",
+    //       label: "Mock Field",
+    //       type: "string",
+    //       validationSchema: "",
+    //     },
+    //   ],
+    //   initialise: async (eventId: number) => {
+    //     const res = await axios.get(domain + "/events/" + eventId);
+    //     let obj: any = {};
+    //     obj.input = res.data.name;
+    //     return obj;
+    //   },
+    //   onSubmit: async (formValues: any, eventId: number) => {
+    //     const res = await axios.delete(
+    //       domain + "/events/" + eventId
+    //     );
+    //     return res.data;
+    //   },
+    // }
+    ],
     getRequest: function () { return __awaiter(void 0, void 0, void 0, function () {
         return __generator(this, function (_a) {
             // const res = await axios.get(domain + "/events");

package/dist/cjs/utils/websockets.js

@@ -0,0 +1,22 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.newSocket = void 0;
+var socket_io_client_1 = __importDefault(require("socket.io-client"));
+var react_1 = require("react");
+var Socket = function (setSocket, apiURL) {
+    (0, react_1.useEffect)(function () {
+        var socketRef = (0, socket_io_client_1.default)(apiURL, {
+            transports: ["websocket"],
+        });
+        setSocket(socketRef);
+        return function () {
+            socketRef.removeAllListeners();
+            socketRef.disconnect();
+        };
+    }, []);
+};
+var newSocket = function (setSocket, apiURL) { return Socket(setSocket, apiURL); };
+exports.newSocket = newSocket;

package/dist/components/GenericForm.js

@@ -140,10 +140,10 @@ function parseFields(fields, previous) {
                                                 : generateSingleField(formfield.element, "".concat(fieldName, ".").concat(index), key) }), (0, jsx_runtime_1.jsxs)(react_1.Button, { type: "button", colorScheme: "red", marginY: 2, onClick: function () { return remove(index); }, children: ["Remove ", "".concat(fieldName, ".").concat(index)] })] })); }), (0, jsx_runtime_1.jsxs)(react_1.Button, { type: "button", marginY: 2, colorScheme: "blue", onClick: function () {
                                     var value = undefined;
                                     if (formfield.element.type === "object") {
-                                        value = getInitialValues(formfield.element.fields);
+                                        value = getCustomInitialValues(formfield.element.fields);
                                     }
                                     else {
-                                        value = getInitialValues([formfield.element])[0];
+                                        value = getCustomInitialValues([formfield.element])[0];
                                     }
                                     push(value);
                                 }, children: ["Add ", fieldName] })] }));
@@ -155,7 +155,7 @@ function parseFields(fields, previous) {
     });
     return computedFields;
 }
-function getInitialValues(fields) {
+function getCustomInitialValues(fields) {
     var obj = {};
     if (!fields) {
         return obj;
@@ -164,7 +164,7 @@ function getInitialValues(fields) {
         if (field.type === "array")
             obj[field.name] = [];
         else if (field.type === "object")
-            obj[field.name] = getInitialValues(field.fields);
+            obj[field.name] = getCustomInitialValues(field.fields);
         else if (field.type === "string")
             obj[field.name] = "";
         else if (field.type === "number")
@@ -174,6 +174,25 @@ function getInitialValues(fields) {
     });
     return obj;
 }
+function getInitialValues(action, rowId) {
+    return __awaiter(this, void 0, void 0, function () {
+        var obj, customInitialValues;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    obj = {};
+                    if (!action.initialise) return [3 /*break*/, 2];
+                    return [4 /*yield*/, action.initialise(rowId)];
+                case 1:
+                    obj = _a.sent();
+                    _a.label = 2;
+                case 2:
+                    customInitialValues = getCustomInitialValues(action.fields);
+                    return [2 /*return*/, Object.assign({}, customInitialValues, obj)];
+            }
+        });
+    });
+}
 function setOptions(fields) {
     return __awaiter(this, void 0, void 0, function () {
         var promises;
@@ -223,16 +242,29 @@ function GenericForm(_a) {
     var _this = this;
     var action = _a.action, onClose = _a.onClose, rowId = _a.rowId;
     var _b = (0, react_2.useState)(parseFields(action.fields)), formFields = _b[0], setFormFields = _b[1];
-    var initialValues = (0, react_2.useState)(getInitialValues(action.fields))[0];
-    var validationSchema = (0, react_2.useState)(parseValidation(action.fields))[0];
+    var _c = (0, react_2.useState)(getCustomInitialValues(action.fields)), initialValues = _c[0], setInitialValues = _c[1];
+    var _d = (0, react_2.useState)(parseValidation(action.fields)), validationSchema = _d[0], setValidationSchema = _d[1];
     (0, react_2.useEffect)(function () {
         setOptions(action.fields).then(function () {
             setFormFields(parseFields(action.fields));
         });
     }, []);
+    var handleFormReset = function () { return __awaiter(_this, void 0, void 0, function () {
+        var newInitialValues;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0: return [4 /*yield*/, getInitialValues(action, rowId)];
+                case 1:
+                    newInitialValues = _a.sent();
+                    console.log(newInitialValues);
+                    setInitialValues(newInitialValues);
+                    return [2 /*return*/];
+            }
+        });
+    }); };
     if (!action.fields)
         return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(formik_1.Formik, { initialValues: initialValues, validationSchema: Yup.object(validationSchema), onSubmit: function (values) { return __awaiter(_this, void 0, void 0, function () {
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(formik_1.Formik, { enableReinitialize: true, initialValues: initialValues, validationSchema: Yup.object(validationSchema), onReset: handleFormReset, onSubmit: function (values) { return __awaiter(_this, void 0, void 0, function () {
                 var res, e_1, err;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
@@ -267,7 +299,7 @@ function GenericForm(_a) {
                 });
             }); }, children: function (_a) {
                 var isSubmitting = _a.isSubmitting;
-                return ((0, jsx_runtime_1.jsxs)(formik_1.Form, { children: [formFields, (0, jsx_runtime_1.jsx)(react_1.Button, { mt: 4, colorScheme: "teal", isLoading: isSubmitting, type: "submit", children: "Submit" })] }));
+                return ((0, jsx_runtime_1.jsxs)(formik_1.Form, { children: [formFields, (0, jsx_runtime_1.jsx)(react_1.Button, { mt: 4, colorScheme: "teal", isLoading: isSubmitting, type: "submit", children: "Submit" }), (0, jsx_runtime_1.jsx)(react_1.Button, { mt: 4, colorScheme: "teal", type: "reset", children: "Initialise Form" })] }));
             } }) }));
 }
 exports.GenericForm = GenericForm;

package/dist/components/Page.js

@@ -15,6 +15,8 @@ var material_react_table_1 = require("material-react-table");
 var export_to_csv_1 = require("export-to-csv");
 var sweetalert2_1 = __importDefault(require("sweetalert2"));
 var MenuItem_1 = __importDefault(require("@mui/material/MenuItem"));
+var socket_io_client_1 = require("socket.io-client");
+var websockets_1 = require("../utils/websockets");
 function pageToUrl(page) {
     return "".concat(page.name.toLowerCase().replace(" ", "_"));
 }
@@ -63,17 +65,31 @@ function exportToCSV(data, filename) {
 }
 function AdminPage(_a) {
     var _b;
-    var pages = _a.pages, selectedPage = _a.selectedPage, basePath = _a.basePath;
-    var _c = (0, react_3.useDisclosure)(), isOpen = _c.isOpen, onOpen = _c.onOpen, onClose = _c.onClose;
-    var _d = (0, react_1.useState)({}), selectedAction = _d[0], setSelectedAction = _d[1];
-    var _e = (0, react_1.useState)([]), data = _e[0], setData = _e[1];
-    var _f = (0, react_1.useState)([]), displayData = _f[0], setDisplayData = _f[1];
-    var _g = (0, react_1.useState)(), rowId = _g[0], setRowId = _g[1];
+    var pages = _a.pages, selectedPage = _a.selectedPage, basePath = _a.basePath, _c = _a.apiURL, apiURL = _c === void 0 ? '' : _c;
+    var _d = (0, react_3.useDisclosure)(), isOpen = _d.isOpen, onOpen = _d.onOpen, onClose = _d.onClose;
+    var _e = (0, react_1.useState)({}), selectedAction = _e[0], setSelectedAction = _e[1];
+    var _f = (0, react_1.useState)([]), data = _f[0], setData = _f[1];
+    var _g = (0, react_1.useState)([]), displayData = _g[0], setDisplayData = _g[1];
+    var _h = (0, react_1.useState)(), rowId = _h[0], setRowId = _h[1];
+    var _j = (0, react_1.useState)(false), refetch = _j[0], setRefetch = _j[1];
+    var _k = (0, react_1.useState)(socket_io_client_1.io), socket = _k[0], setSocket = _k[1];
+    (0, websockets_1.newSocket)(setSocket, apiURL);
     (0, react_1.useEffect)(function () {
         selectedPage.getRequest().then(function (resArray) {
             setData(resArray);
+            setRefetch(false);
         });
-    }, []);
+    }, [refetch]); // Do not remove 'refetch' from here !!!
+    (0, react_1.useEffect)(function () {
+        socket.on("updateData", function (message) {
+            console.log("Message emitted from socket: " + message);
+            setRefetch(true);
+            var rowActionsMenu = document.querySelector(".MuiPaper-root.MuiPopover-paper.MuiMenu-paper");
+            if (rowActionsMenu) {
+                rowActionsMenu.remove();
+            }
+        });
+    }, [socket, selectedPage]);
     (0, react_1.useEffect)(function () {
         setDisplayData(data.map(function (table_data) {
             return selectedPage.tableFields.map(function (field) { return field.access(table_data); });
@@ -98,7 +114,6 @@ function AdminPage(_a) {
                     } }) }), (0, jsx_runtime_1.jsxs)(react_3.Modal, { size: "6xl", isOpen: isOpen, onClose: onClose, children: [(0, jsx_runtime_1.jsx)(react_3.ModalOverlay, {}), (0, jsx_runtime_1.jsxs)(react_3.ModalContent, { children: [(0, jsx_runtime_1.jsx)(react_3.ModalHeader, { children: selectedAction.name }), (0, jsx_runtime_1.jsx)(react_3.ModalCloseButton, {}), (0, jsx_runtime_1.jsxs)(react_3.ModalBody, { children: [selectedAction.fields && ((_b = selectedAction.fields) === null || _b === void 0 ? void 0 : _b.length) > 0 ? ((0, jsx_runtime_1.jsx)(GenericForm_1.GenericForm, { action: selectedAction, onClose: onClose, rowId: rowId })) : ((0, jsx_runtime_1.jsx)(react_3.Button, { colorScheme: "blue", mr: 3, onClick: function () {
                                             selectedAction.onSubmit(rowId);
                                             onClose();
-                                            window.location.reload();
                                         }, children: "Confirm Action" })), (0, jsx_runtime_1.jsx)(react_3.Button, { colorScheme: "red", mr: 3, onClick: onClose, children: "Close" })] })] })] })] }));
 }
 exports.AdminPage = AdminPage;

package/dist/esm/App.js

@@ -3,8 +3,8 @@ import { ChakraProvider } from "@chakra-ui/react";
 import { BrowserRouter, Route, Routes } from "react-router-dom";
 import { AdminPage } from "./components/Page";
 import { pageToUrl } from "./components/Page";
-function AdminPanel(_a) {
+function App(_a) {
     var pages = _a.pages, basePath = _a.basePath;
-    return (_jsx(ChakraProvider, { children: _jsx(BrowserRouter, { children: _jsxs(Routes, { children: [pages.map(function (page) { return (_jsx(Route, { path: "".concat(basePath, "/").concat(pageToUrl(page)), element: _jsx(AdminPage, { pages: pages, selectedPage: page, basePath: basePath }) })); }), pages[0] ? (_jsx(Route, { path: "".concat(basePath, "/*"), element: _jsx(AdminPage, { pages: pages, selectedPage: pages[0], basePath: basePath }) })) : null] }) }) }));
+    return (_jsx(ChakraProvider, { children: _jsx(BrowserRouter, { children: _jsxs(Routes, { children: [pages.map(function (page) { return (_jsx(Route, { path: "".concat(basePath, "/").concat(pageToUrl(page)), element: _jsx(AdminPage, { pages: pages, selectedPage: page, basePath: basePath, apiURL: "http://localhost:3001" }) })); }), pages[0] ? (_jsx(Route, { path: "".concat(basePath, "/*"), element: _jsx(AdminPage, { pages: pages, selectedPage: pages[0], basePath: basePath, apiURL: "http://localhost:3001" }) })) : null] }) }) }));
 }
-export default AdminPanel;
+export default App;

package/dist/esm/components/GenericForm.js

@@ -111,10 +111,10 @@ function parseFields(fields, previous) {
                                                 : generateSingleField(formfield.element, "".concat(fieldName, ".").concat(index), key) }), _jsxs(Button, { type: "button", colorScheme: "red", marginY: 2, onClick: function () { return remove(index); }, children: ["Remove ", "".concat(fieldName, ".").concat(index)] })] })); }), _jsxs(Button, { type: "button", marginY: 2, colorScheme: "blue", onClick: function () {
                                     var value = undefined;
                                     if (formfield.element.type === "object") {
-                                        value = getInitialValues(formfield.element.fields);
+                                        value = getCustomInitialValues(formfield.element.fields);
                                     }
                                     else {
-                                        value = getInitialValues([formfield.element])[0];
+                                        value = getCustomInitialValues([formfield.element])[0];
                                     }
                                     push(value);
                                 }, children: ["Add ", fieldName] })] }));
@@ -126,7 +126,7 @@ function parseFields(fields, previous) {
     });
     return computedFields;
 }
-function getInitialValues(fields) {
+function getCustomInitialValues(fields) {
     var obj = {};
     if (!fields) {
         return obj;
@@ -135,7 +135,7 @@ function getInitialValues(fields) {
         if (field.type === "array")
             obj[field.name] = [];
         else if (field.type === "object")
-            obj[field.name] = getInitialValues(field.fields);
+            obj[field.name] = getCustomInitialValues(field.fields);
         else if (field.type === "string")
             obj[field.name] = "";
         else if (field.type === "number")
@@ -145,6 +145,25 @@ function getInitialValues(fields) {
     });
     return obj;
 }
+function getInitialValues(action, rowId) {
+    return __awaiter(this, void 0, void 0, function () {
+        var obj, customInitialValues;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    obj = {};
+                    if (!action.initialise) return [3 /*break*/, 2];
+                    return [4 /*yield*/, action.initialise(rowId)];
+                case 1:
+                    obj = _a.sent();
+                    _a.label = 2;
+                case 2:
+                    customInitialValues = getCustomInitialValues(action.fields);
+                    return [2 /*return*/, Object.assign({}, customInitialValues, obj)];
+            }
+        });
+    });
+}
 function setOptions(fields) {
     return __awaiter(this, void 0, void 0, function () {
         var promises;
@@ -194,16 +213,29 @@ export function GenericForm(_a) {
     var _this = this;
     var action = _a.action, onClose = _a.onClose, rowId = _a.rowId;
     var _b = useState(parseFields(action.fields)), formFields = _b[0], setFormFields = _b[1];
-    var initialValues = useState(getInitialValues(action.fields))[0];
-    var validationSchema = useState(parseValidation(action.fields))[0];
+    var _c = useState(getCustomInitialValues(action.fields)), initialValues = _c[0], setInitialValues = _c[1];
+    var _d = useState(parseValidation(action.fields)), validationSchema = _d[0], setValidationSchema = _d[1];
     useEffect(function () {
         setOptions(action.fields).then(function () {
             setFormFields(parseFields(action.fields));
         });
     }, []);
+    var handleFormReset = function () { return __awaiter(_this, void 0, void 0, function () {
+        var newInitialValues;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0: return [4 /*yield*/, getInitialValues(action, rowId)];
+                case 1:
+                    newInitialValues = _a.sent();
+                    console.log(newInitialValues);
+                    setInitialValues(newInitialValues);
+                    return [2 /*return*/];
+            }
+        });
+    }); };
     if (!action.fields)
         return _jsx(_Fragment, {});
-    return (_jsx(_Fragment, { children: _jsx(Formik, { initialValues: initialValues, validationSchema: Yup.object(validationSchema), onSubmit: function (values) { return __awaiter(_this, void 0, void 0, function () {
+    return (_jsx(_Fragment, { children: _jsx(Formik, { enableReinitialize: true, initialValues: initialValues, validationSchema: Yup.object(validationSchema), onReset: handleFormReset, onSubmit: function (values) { return __awaiter(_this, void 0, void 0, function () {
                 var res, e_1, err;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
@@ -238,6 +270,6 @@ export function GenericForm(_a) {
                 });
             }); }, children: function (_a) {
                 var isSubmitting = _a.isSubmitting;
-                return (_jsxs(Form, { children: [formFields, _jsx(Button, { mt: 4, colorScheme: "teal", isLoading: isSubmitting, type: "submit", children: "Submit" })] }));
+                return (_jsxs(Form, { children: [formFields, _jsx(Button, { mt: 4, colorScheme: "teal", isLoading: isSubmitting, type: "submit", children: "Submit" }), _jsx(Button, { mt: 4, colorScheme: "teal", type: "reset", children: "Initialise Form" })] }));
             } }) }));
 }

package/dist/esm/components/Page.js

@@ -9,6 +9,8 @@ import { MaterialReactTable } from "material-react-table";
 import { mkConfig, generateCsv, download } from "export-to-csv";
 import Swal from "sweetalert2";
 import MenuItem from "@mui/material/MenuItem";
+import { io } from "socket.io-client";
+import { newSocket } from "../utils/websockets";
 export function pageToUrl(page) {
     return "".concat(page.name.toLowerCase().replace(" ", "_"));
 }
@@ -56,17 +58,31 @@ function exportToCSV(data, filename) {
 }
 export function AdminPage(_a) {
     var _b;
-    var pages = _a.pages, selectedPage = _a.selectedPage, basePath = _a.basePath;
-    var _c = useDisclosure(), isOpen = _c.isOpen, onOpen = _c.onOpen, onClose = _c.onClose;
-    var _d = useState({}), selectedAction = _d[0], setSelectedAction = _d[1];
-    var _e = useState([]), data = _e[0], setData = _e[1];
-    var _f = useState([]), displayData = _f[0], setDisplayData = _f[1];
-    var _g = useState(), rowId = _g[0], setRowId = _g[1];
+    var pages = _a.pages, selectedPage = _a.selectedPage, basePath = _a.basePath, _c = _a.apiURL, apiURL = _c === void 0 ? '' : _c;
+    var _d = useDisclosure(), isOpen = _d.isOpen, onOpen = _d.onOpen, onClose = _d.onClose;
+    var _e = useState({}), selectedAction = _e[0], setSelectedAction = _e[1];
+    var _f = useState([]), data = _f[0], setData = _f[1];
+    var _g = useState([]), displayData = _g[0], setDisplayData = _g[1];
+    var _h = useState(), rowId = _h[0], setRowId = _h[1];
+    var _j = useState(false), refetch = _j[0], setRefetch = _j[1];
+    var _k = useState(io), socket = _k[0], setSocket = _k[1];
+    newSocket(setSocket, apiURL);
     useEffect(function () {
         selectedPage.getRequest().then(function (resArray) {
             setData(resArray);
+            setRefetch(false);
         });
-    }, []);
+    }, [refetch]); // Do not remove 'refetch' from here !!!
+    useEffect(function () {
+        socket.on("updateData", function (message) {
+            console.log("Message emitted from socket: " + message);
+            setRefetch(true);
+            var rowActionsMenu = document.querySelector(".MuiPaper-root.MuiPopover-paper.MuiMenu-paper");
+            if (rowActionsMenu) {
+                rowActionsMenu.remove();
+            }
+        });
+    }, [socket, selectedPage]);
     useEffect(function () {
         setDisplayData(data.map(function (table_data) {
             return selectedPage.tableFields.map(function (field) { return field.access(table_data); });
@@ -91,6 +107,5 @@ export function AdminPage(_a) {
                     } }) }), _jsxs(Modal, { size: "6xl", isOpen: isOpen, onClose: onClose, children: [_jsx(ModalOverlay, {}), _jsxs(ModalContent, { children: [_jsx(ModalHeader, { children: selectedAction.name }), _jsx(ModalCloseButton, {}), _jsxs(ModalBody, { children: [selectedAction.fields && ((_b = selectedAction.fields) === null || _b === void 0 ? void 0 : _b.length) > 0 ? (_jsx(GenericForm, { action: selectedAction, onClose: onClose, rowId: rowId })) : (_jsx(Button, { colorScheme: "blue", mr: 3, onClick: function () {
                                             selectedAction.onSubmit(rowId);
                                             onClose();
-                                            window.location.reload();
                                         }, children: "Confirm Action" })), _jsx(Button, { colorScheme: "red", mr: 3, onClick: onClose, children: "Close" })] })] })] })] }));
 }

package/dist/esm/index.js

@@ -2,11 +2,11 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
 import ReactDOM from "react-dom/client";
 import "./index.css";
-import AdminPanel from "./App";
+import App from "./App";
 import reportWebVitals from "./reportWebVitals";
-import { event } from "./pages/event";
+import { pages } from "./schema/schema.config";
 var root = ReactDOM.createRoot(document.getElementById("root"));
-root.render(_jsx(React.StrictMode, { children: _jsx(AdminPanel, { pages: [event], basePath: "" }) }));
+root.render(_jsx(React.StrictMode, { children: _jsx(App, { pages: pages, basePath: "" }) }));
 // If you want to start measuring performance in your app, pass a function
 // to log results (for example: reportWebVitals(console.log))
 // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals

package/dist/esm/pages/event.js

@@ -39,7 +39,31 @@ var domain = "http://localhost:3001";
 export var event = {
     name: "Events",
     actions: [],
-    rowActions: [],
+    rowActions: [
+    //   {
+    //   name: "Delete Event",
+    //   fields: [
+    //     {
+    //       name: "input",
+    //       label: "Mock Field",
+    //       type: "string",
+    //       validationSchema: "",
+    //     },
+    //   ],
+    //   initialise: async (eventId: number) => {
+    //     const res = await axios.get(domain + "/events/" + eventId);
+    //     let obj: any = {};
+    //     obj.input = res.data.name;
+    //     return obj;
+    //   },
+    //   onSubmit: async (formValues: any, eventId: number) => {
+    //     const res = await axios.delete(
+    //       domain + "/events/" + eventId
+    //     );
+    //     return res.data;
+    //   },
+    // }
+    ],
     getRequest: function () { return __awaiter(void 0, void 0, void 0, function () {
         return __generator(this, function (_a) {
             // const res = await axios.get(domain + "/events");