muffin-admin 1.36.4 → 1.36.6

package/dist/esm/views/create.js

@@ -0,0 +1,16 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from "react";
+import { Create, SimpleForm, TopToolbar, ListButton } from "react-admin";
+import initRAItems from "../ui";
+import { checkParams, processAdmin, setupAdmin } from "../utils";
+
+// Initialize a create component
+setupAdmin("create", checkParams(function (inputs, res) {
+  return function MACreate(props) {
+    var Actions = /*#__PURE__*/React.createElement(TopToolbar, null, /*#__PURE__*/React.createElement(ListButton, null));
+    return /*#__PURE__*/React.createElement(Create, _extends({
+      actions: Actions
+    }, props), /*#__PURE__*/React.createElement(SimpleForm, null, processAdmin("create-inputs", inputs, res)));
+  };
+}));
+setupAdmin("create-inputs", initRAItems);

package/dist/esm/views/edit.js

@@ -0,0 +1,37 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["basePath", "resource"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import React from "react";
+import { Edit, ListButton, ShowButton, SimpleForm, TopToolbar } from "react-admin";
+import initRAItems from "../ui";
+import { checkParams, processAdmin, setupAdmin } from "../utils";
+import { ActionButton } from "../buttons/ActionButton";
+
+// Initialize an edit component
+setupAdmin("edit", checkParams(function (_ref, res) {
+  var actions = _ref.actions,
+    inputs = _ref.inputs;
+  return function MAEdit(props) {
+    var Actions = function Actions(_ref2) {
+      var basePath = _ref2.basePath,
+        resource = _ref2.resource,
+        baseProps = _objectWithoutProperties(_ref2, _excluded);
+      return /*#__PURE__*/React.createElement(TopToolbar, null, actions.map(function (props, idx) {
+        var aProps = _objectSpread(_objectSpread({
+          resource: resource,
+          basePath: basePath
+        }, baseProps), props);
+        return /*#__PURE__*/React.createElement(ActionButton, _extends({
+          key: idx
+        }, aProps));
+      }), /*#__PURE__*/React.createElement(ListButton, null), /*#__PURE__*/React.createElement(ShowButton, null));
+    };
+    return /*#__PURE__*/React.createElement(Edit, _extends({
+      actions: /*#__PURE__*/React.createElement(Actions, null)
+    }, props), /*#__PURE__*/React.createElement(SimpleForm, null, processAdmin("edit-inputs", inputs, res)));
+  };
+}));
+setupAdmin("edit-inputs", initRAItems);

package/dist/esm/views/list.js

@@ -0,0 +1,64 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["children", "filters", "edit", "pagination", "show", "limit", "limitMax", "actions"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import React from "react";
+import { BulkDeleteButton, Datagrid, EditButton, Filter, List, Pagination } from "react-admin";
+import uniq from "lodash/uniq";
+import sortBy from "lodash/sortBy";
+import initRAItems from "../ui";
+import { checkParams, processAdmin, setupAdmin } from "../utils";
+import { BulkActionButton } from "../buttons/ActionButton";
+var defaultPagination = /*#__PURE__*/React.createElement(Pagination, {
+  rowsPerPageOptions: [10, 25, 50, 100]
+});
+
+// Initiliaze a list component
+setupAdmin("list", checkParams(function (props, res) {
+  var children = props.children,
+    filters = props.filters,
+    edit = props.edit,
+    pagination = props.pagination,
+    show = props.show,
+    limit = props.limit,
+    limitMax = props.limitMax,
+    actions = props.actions,
+    listProps = _objectWithoutProperties(props, _excluded);
+  children = processAdmin("list-fields", children, res);
+  if (edit) children.push( /*#__PURE__*/React.createElement(EditButton, {
+    key: "edit-button"
+  }));
+  pagination = pagination || /*#__PURE__*/React.createElement(Pagination, {
+    rowsPerPageOptions: sortBy(uniq([10, 25, 50, 100, limit, limitMax]))
+  });
+  return function MAList(props) {
+    var Filters = function Filters(props) {
+      return /*#__PURE__*/React.createElement(Filter, props, processAdmin("list-filters", filters, res));
+    };
+    var Actions = processAdmin("list-bulkActions", actions);
+    props = _objectSpread(_objectSpread({}, props), listProps);
+    return /*#__PURE__*/React.createElement(List, _extends({
+      filters: /*#__PURE__*/React.createElement(Filters, null),
+      bulkActionButtons: /*#__PURE__*/React.createElement(Actions, null),
+      perPage: limit,
+      pagination: pagination || defaultPagination
+    }, props), /*#__PURE__*/React.createElement(Datagrid, {
+      rowClick: show ? "show" : null
+    }, children));
+  };
+}));
+setupAdmin("list-bulkActions", function (actions) {
+  return function MABulkActions(props) {
+    var buttons = actions.map(function (action, idx) {
+      var aProps = _objectSpread(_objectSpread({}, action), props);
+      return /*#__PURE__*/React.createElement(BulkActionButton, _extends({
+        key: idx
+      }, aProps));
+    });
+    return /*#__PURE__*/React.createElement(React.Fragment, null, buttons, /*#__PURE__*/React.createElement(BulkDeleteButton, props));
+  };
+});
+setupAdmin("list-filters", initRAItems);
+setupAdmin("list-fields", initRAItems);

package/dist/esm/views/show.js

@@ -0,0 +1,26 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from "react";
+import { ListButton, EditButton, Show, SimpleShowLayout, TopToolbar } from "react-admin";
+import initRAItems from "../ui";
+import { checkParams, processAdmin, setupAdmin } from "../utils";
+import { ActionButton } from "../buttons/ActionButton";
+
+// Initiliaze a show component
+setupAdmin("show", checkParams(function (_ref, resource) {
+  var actions = _ref.actions,
+    fields = _ref.fields;
+  return function MAShow(props) {
+    var Actions = function Actions() {
+      return /*#__PURE__*/React.createElement(TopToolbar, null, actions.map(function (props, idx) {
+        return /*#__PURE__*/React.createElement(ActionButton, _extends({
+          key: idx,
+          resource: resource
+        }, props));
+      }), /*#__PURE__*/React.createElement(ListButton, null), /*#__PURE__*/React.createElement(EditButton, null));
+    };
+    return /*#__PURE__*/React.createElement(Show, _extends({
+      actions: /*#__PURE__*/React.createElement(Actions, null)
+    }, props), /*#__PURE__*/React.createElement(SimpleShowLayout, null, processAdmin("show-fields", fields, resource)));
+  };
+}));
+setupAdmin("show-fields", initRAItems);

package/dist/esm/web.js

@@ -0,0 +1,2 @@
+import { initAdmin } from ".";
+global.initAdmin = initAdmin;

package/package.json

@@ -1,8 +1,13 @@
 {
   "name": "muffin-admin",
-  "version": "1.36.4",
+  "version": "1.36.6",
   "description": "NPM package for https://github.com/klen/muffin-admin",
-  "main": "dist/index.js",
+  "files": [
+    "src",
+    "dist"
+  ],
+  "main": "dist/cjs/index.js",
+  "module": "dist/esm/index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },
@@ -35,14 +40,5 @@
     "webpack": "^5.24.4",
     "webpack-cli": "^5.0.0",
     "webpack-dev-server": "^4.3.1"
-  },
-  "babel": {
-    "presets": [
-      "@babel/preset-env",
-      "@babel/preset-react"
-    ],
-    "plugins": [
-      "@babel/plugin-transform-runtime"
-    ]
   }
 }

package/src/admin.jsx

@@ -0,0 +1,78 @@
+import React from "react"
+
+import {
+  Admin,
+  AppBar,
+  Layout,
+  Login,
+  ToggleThemeButton,
+  defaultTheme,
+} from "react-admin"
+import {
+  IconButton,
+  SvgIcon,
+  Tooltip,
+  Typography,
+  createTheme,
+} from "@mui/material"
+import * as icons from "@mui/icons-material"
+
+import authProvider from "./authprovider"
+import dataProvider from "./dataprovider"
+import { processAdmin, setupAdmin } from "./utils"
+
+import "./dashboard"
+import "./resources"
+
+const darkTheme = createTheme({
+  palette: { mode: "dark" },
+})
+
+// Initialize the admin
+setupAdmin("admin", (props) => {
+  const { apiUrl, auth, adminProps, appBarLinks, dashboard, resources } = props
+
+  let appBar = (props) => (
+    <AppBar {...props}>
+      <Typography
+        variant="h6"
+        color="inherit"
+        id="react-admin-title"
+        style={{
+          flex: 1,
+          textOverflow: "ellipsis",
+          whiteSpace: "nowrap",
+          overflow: "hidden",
+        }}
+      />
+      <ToggleThemeButton lightTheme={defaultTheme} darkTheme={darkTheme} />
+      {appBarLinks.map((info) => (
+        <Tooltip key={info.url} title={info.title}>
+          <IconButton color="inherit" href={info.url}>
+            <SvgIcon component={icons[info.icon]} />
+          </IconButton>
+        </Tooltip>
+      ))}
+    </AppBar>
+  )
+
+  return (
+    <Admin
+      authProvider={processAdmin("auth", auth)}
+      dataProvider={processAdmin("data", apiUrl)}
+      dashboard={processAdmin("dashboard", dashboard)}
+      loginPage={processAdmin("login", auth)}
+      layout={(props) => <Layout appBar={appBar} {...props} />}
+      {...adminProps}
+    >
+      {processAdmin("resources", resources)}
+    </Admin>
+  )
+})
+
+// Initialize authentication and data providers
+setupAdmin("auth", authProvider)
+setupAdmin("data", dataProvider)
+
+// Initialize login page
+setupAdmin("login", () => Login)

package/src/authprovider.js

@@ -0,0 +1,85 @@
+import Cookies from "js-cookie"
+
+import { makeRequest, processAdmin, requestHeaders, setupAdmin } from "./utils"
+
+setupAdmin(
+  "auth-get",
+  ({ storage }) =>
+    (name) =>
+      storage == "localstorage" ? localStorage.getItem(name) : Cookies.get(name)
+)
+
+setupAdmin("auth-set", ({ storage }) => (name, value) => {
+  if (storage == "localstorage") {
+    localStorage.setItem(name, value)
+    requestHeaders["Authorization"] = value
+  } else Cookies.set(name, value)
+})
+
+export default (props) => {
+  const { identityURL, authorizeURL, logoutURL, required, storage_name } = props
+
+  const authGet = processAdmin("auth-get", props)
+  const authSet = processAdmin("auth-set", props)
+
+  // Initialize request headers
+  authSet(storage_name, authGet(storage_name))
+
+  let getIdentity = async () => {
+    if (identityURL) {
+      let { json } = await makeRequest(identityURL)
+      return json
+    }
+  }
+
+  if (required)
+    return {
+      login: async (data) => {
+        if (!authorizeURL) throw { message: "Authorization is not supported" }
+
+        let { json } = await makeRequest(authorizeURL, { data, method: "POST" })
+        authSet(storage_name, json)
+      },
+
+      checkError: async (error) => {
+        const { status } = error
+
+        if (status == 401 || status == 403) {
+          // Clean storage
+          authSet(storage_name, "")
+
+          throw {
+            message: "Invalid authorization",
+            redirectTo: logoutURL,
+            logoutUser: !logoutURL,
+          }
+        }
+      },
+
+      checkAuth: async () => {
+        const auth = authGet(storage_name)
+        if (!auth) throw { message: "Authorization required" }
+
+        if (!identityURL) return auth
+
+        let user = await getIdentity()
+        if (!user) throw { message: "Authorization required" }
+
+        return user
+      },
+
+      logout: async () => {
+        // Clean storage
+        authSet(storage_name, "")
+
+        if (logoutURL) window.location = logoutURL
+      },
+
+      getIdentity,
+
+      getPermissions: () => {
+        const role = authGet(storage_name + "_role")
+        return role ? Promise.resolve(role) : Promise.reject()
+      },
+    }
+}

package/src/buttons/ActionButton.jsx

@@ -0,0 +1,99 @@
+import React from "react"
+
+import {
+  Button,
+  useRefresh,
+  useUnselectAll,
+  useNotify,
+  useRecordContext,
+} from "react-admin"
+import * as icons from "@mui/icons-material"
+
+import useAction from "../hooks/useAction"
+
+export const BulkActionButton = ({
+  label,
+  icon,
+  title,
+  action,
+  resource,
+  selectedIds,
+}) => {
+  const refresh = useRefresh(),
+    unselectAll = useUnselectAll(resource),
+    notify = useNotify(),
+    Icon = icons[icon]
+
+  const mutation = useAction(resource, action)
+
+  let onClick = () => {
+    mutation.mutate(
+      {
+        action,
+        ids: selectedIds,
+      },
+      {
+        onSuccess: ({ data }) => {
+          if (data && data.message) notify(data.message, { type: "success" })
+          refresh()
+          unselectAll()
+        },
+        onError: (err) => {
+          notify(typeof err === "string" ? err : err.message, { type: "error" })
+        },
+      }
+    )
+  }
+
+  return (
+    <Button
+      label={label}
+      title={title}
+      onClick={onClick}
+      disabled={mutation.isLoading}
+    >
+      {Icon && <Icon />}
+    </Button>
+  )
+}
+
+export const ActionButton = (props) => {
+  const { icon, label, title, resource, action } = props
+  const record = useRecordContext()
+  const mutation = useAction(resource, action)
+
+  const refresh = useRefresh(),
+    notify = useNotify(),
+    Icon = icons[icon]
+
+  let onClick = () => {
+    mutation.mutate(
+      { record },
+      {
+        onSuccess: ({ data }) => {
+          refresh()
+          if (data && data.redirectTo) window.location = data.redirectTo
+          if (data && data.message) notify(data.message, { type: "success" })
+        },
+        onError: (error) => {
+          notify(typeof error === "string" ? error : error.message, {
+            type: "error",
+          })
+        },
+      }
+    )
+  }
+
+  return (
+    <Button
+      label={label}
+      title={title}
+      onClick={onClick}
+      disabled={mutation.isLoading}
+    >
+      {Icon && <Icon />}
+    </Button>
+  )
+}
+
+export default ActionButton

package/src/buttons/LinkButton.jsx

@@ -0,0 +1,20 @@
+import React from "react"
+import { Button } from "react-admin"
+import { Link } from "react-router-dom"
+import * as icons from "@mui/icons-material"
+
+const LinkButton = ({ label, icon, title, resource, filters }) => {
+  const Icon = icons[icon] || icon
+  let linkParams = {
+    pathname: `/${resource}`,
+    search: filters ? `filter=${JSON.stringify(filters)}` : undefined,
+  }
+
+  return (
+    <Button label={label} title={title} component={Link} to={linkParams}>
+      {Icon && <Icon />}
+    </Button>
+  )
+}
+
+export default LinkButton

package/src/dashboard.jsx

@@ -0,0 +1,74 @@
+import React from "react"
+
+import {
+  Grid,
+  Card,
+  CardContent,
+  Typography,
+  Table,
+  TableBody,
+  TableRow,
+  TableCell,
+} from "@mui/material"
+
+import { setupAdmin } from "./utils"
+
+const AdminTableView = ({ src }) => (
+  <Table>
+    <TableBody>
+      {src.map((row, idx) => (
+        <TableRow key={idx} hover>
+          {row.map((cell, idx) => (
+            <TableCell key={idx}>{cell}</TableCell>
+          ))}
+        </TableRow>
+      ))}
+    </TableBody>
+  </Table>
+)
+
+const AdminCard = ({ src }) => {
+  if (Array.isArray(src)) {
+    return (
+      <Grid container item spacing={2}>
+        {src.map((card, idx) => (
+          <AdminCard key={idx} src={card} />
+        ))}
+      </Grid>
+    )
+  }
+
+  let { title, value } = src
+
+  return (
+    <Grid item xs>
+      <Card>
+        <CardContent>
+          <Typography
+            variant="h5"
+            component="h2"
+            m={2}
+            style={{ textAlign: "center" }}
+          >
+            {title}
+          </Typography>
+          {(Array.isArray(value) && <AdminTableView src={value} />) || (
+            <pre>{JSON.stringify(value, null, 2)}</pre>
+          )}
+        </CardContent>
+      </Card>
+    </Grid>
+  )
+}
+
+// Process dashboard
+setupAdmin("dashboard", (props) => {
+  if (!props) return
+
+  const Dashboard = () => (
+    <Grid container spacing={1}>
+      <AdminCard src={props} />
+    </Grid>
+  )
+  return Dashboard
+})

package/src/dataprovider.js

@@ -0,0 +1,94 @@
+import { makeRequest } from "./utils"
+
+export default (apiUrl) => {
+  const methods = {
+    getList: async (resource, { filter, pagination, sort }) => {
+      const query = {}
+      if (filter) query.where = JSON.stringify(filter)
+      if (pagination) {
+        const { page, perPage: limit } = pagination
+        query.limit = limit
+        query.offset = limit * (page - 1)
+      }
+      if (sort) {
+        const { field, order } = sort
+        query.sort = order == "ASC" ? field : `-${field}`
+      }
+
+      const { headers, json } = await makeRequest(`${apiUrl}/${resource}`, {
+        query,
+      })
+      return {
+        data: json,
+        total: parseInt(headers.get("x-total"), 10),
+      }
+    },
+
+    getOne: async (resource, { id }) => {
+      const { json } = await makeRequest(`${apiUrl}/${resource}/${id}`)
+      return { data: json }
+    },
+
+    create: async (resource, { data }) => {
+      const { json } = await makeRequest(`${apiUrl}/${resource}`, {
+        data,
+        method: "POST",
+      })
+      return { data: json }
+    },
+
+    update: async (resource, { id, data }) => {
+      const { json } = await makeRequest(`${apiUrl}/${resource}/${id}`, {
+        data,
+        method: "PUT",
+      })
+      return { data: json }
+    },
+
+    updateMany: async (resource, { ids, data }) => {
+      await Promise.all(ids.map((id) => methods.update(resource, { id, data })))
+      return { data: ids }
+    },
+
+    delete: async (resource, { id }) => {
+      await makeRequest(`${apiUrl}/${resource}/${id}`, {
+        method: "DELETE",
+      })
+      return { data: { id } }
+    },
+
+    deleteMany: async (resource, { ids }) => {
+      await makeRequest(`${apiUrl}/${resource}`, {
+        data: ids,
+        method: "DELETE",
+      })
+      return { data: ids }
+    },
+
+    getMany: (resource, { ids }) => {
+      return methods.getList(resource, { filter: { id: { $in: ids } } })
+    },
+
+    getManyReference: async (resource, { target, id, filter, ...opts }) => {
+      filter = filter || {}
+      filter[target] = id
+      return await methods.getList(resource, { filter, ...opts })
+    },
+
+    runAction: async (resource, action, props) => {
+      const { payload, ids, record } = props
+      action = action.replace(/^\/+/, "")
+      if (record) {
+        action = action.replace(/\{([^}]+)\}/, (_, field) => record[field])
+      }
+      const { json } = await makeRequest(`${apiUrl}/${action}`, {
+        query: { ids },
+        method: "POST",
+        data: payload,
+      })
+      return { data: json }
+    },
+  }
+
+  return methods
+}

package/src/fields/AvatarField.jsx

@@ -0,0 +1,33 @@
+import React from "react"
+import get from "lodash/get"
+import { useRecordContext } from "ra-core"
+import Avatar from "@mui/material/Avatar"
+
+const AvatarField = ({ source, alt, style, nameProp, ...props }) => {
+  const record = useRecordContext(props)
+
+  let value = get(record, source),
+    name = record[nameProp]
+
+  const letters = name
+    ? name
+        .trim(" ")
+        .split(/\s+/)
+        .slice(0, 2)
+        .map((n) => n[0].toUpperCase())
+        .join("")
+    : ""
+
+  return (
+    <Avatar src={value} alt={alt} style={style}>
+      {letters}
+    </Avatar>
+  )
+}
+
+AvatarField.displayName = "AvatarField"
+AvatarField.defaultProps = {
+  addLabel: true,
+}
+
+export default AvatarField