You can not select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
		
			
		
			
				
					
					
						
							138 lines
						
					
					
						
							6.6 KiB
						
					
					
				
			
		
		
	
	
							138 lines
						
					
					
						
							6.6 KiB
						
					
					
				| "use strict";
 | |
| 
 | |
| Object.defineProperty(exports, "__esModule", {
 | |
|   value: true
 | |
| });
 | |
| exports.default = void 0;
 | |
| 
 | |
| var _react = _interopRequireWildcard(require("react"));
 | |
| 
 | |
| var _reactRouterDom = require("react-router-dom");
 | |
| 
 | |
| var _styledComponents = require("styled-components");
 | |
| 
 | |
| var _designSystem = require("@adminjs/design-system");
 | |
| 
 | |
| var _reactRouter = require("react-router");
 | |
| 
 | |
| var _viewHelpers = _interopRequireDefault(require("../../backend/utils/view-helpers/view-helpers"));
 | |
| 
 | |
| var _sidebar = _interopRequireDefault(require("./app/sidebar/sidebar"));
 | |
| 
 | |
| var _topBar = _interopRequireDefault(require("./app/top-bar"));
 | |
| 
 | |
| var _notice = _interopRequireDefault(require("./app/notice"));
 | |
| 
 | |
| var _allowOverride = _interopRequireDefault(require("../hoc/allow-override"));
 | |
| 
 | |
| var _routes = require("./routes");
 | |
| 
 | |
| var _useHistoryListen = _interopRequireDefault(require("../hooks/use-history-listen"));
 | |
| 
 | |
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 | |
| 
 | |
| function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 | |
| 
 | |
| function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 | |
| 
 | |
| /* eslint-disable react/no-children-prop */
 | |
| const GlobalStyle = (0, _styledComponents.createGlobalStyle)(["html,body,#app{margin:0;padding:0;width:100%;height:100%;color:", "}"], ({
 | |
|   theme
 | |
| }) => theme.colors.grey100);
 | |
| const h = new _viewHelpers.default();
 | |
| 
 | |
| const App = () => {
 | |
|   const [sidebarVisible, toggleSidebar] = (0, _react.useState)(false);
 | |
|   const location = (0, _reactRouter.useLocation)();
 | |
|   (0, _useHistoryListen.default)();
 | |
|   (0, _react.useEffect)(() => {
 | |
|     if (sidebarVisible) {
 | |
|       toggleSidebar(false);
 | |
|     }
 | |
|   }, [location]);
 | |
|   const resourceId = ':resourceId';
 | |
|   const actionName = ':actionName';
 | |
|   const recordId = ':recordId';
 | |
|   const pageName = ':pageName';
 | |
|   const dashboardUrl = h.dashboardUrl();
 | |
|   const recordActionUrl = h.recordActionUrl({
 | |
|     resourceId,
 | |
|     recordId,
 | |
|     actionName
 | |
|   });
 | |
|   const resourceActionUrl = h.resourceActionUrl({
 | |
|     resourceId,
 | |
|     actionName
 | |
|   });
 | |
|   const bulkActionUrl = h.bulkActionUrl({
 | |
|     resourceId,
 | |
|     actionName
 | |
|   });
 | |
|   const resourceUrl = h.resourceUrl({
 | |
|     resourceId
 | |
|   });
 | |
|   const pageUrl = h.pageUrl(pageName);
 | |
|   /**
 | |
|    * When defining AdminJS routes, we use Routes component twice.
 | |
|    * This results in warnings appearing in console, for example about not being able to locate
 | |
|    * "/admin" route. They can be safely ignored though and should appear only
 | |
|    * in development environment. The warnings originate from the difference between
 | |
|    * "Switch" component that AdminJS had used in "react-router" v5 which was later replaced
 | |
|    * with "Routes" in "react-router" v6. "Switch" would use the first "Route" component
 | |
|    * that matched the provided path, while "Routes" searches for the best matching pattern.
 | |
|    * In AdminJS we use "DrawerPortal" to display actions in a drawer when
 | |
|    * "showInDrawer" option is set to true. The drawer should appear above the currently viewed
 | |
|    * page, but "Routes" broke this behavior because it instead showed a record action route with
 | |
|    * an empty background.
 | |
|    * The current flow is that first "Routes" component includes "Resource" route component
 | |
|    * for drawer-placed actions and the second "Routes" is entered for record actions
 | |
|    * on a separate page.
 | |
|    */
 | |
| 
 | |
|   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_designSystem.Reset, null), /*#__PURE__*/_react.default.createElement(GlobalStyle, null), /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
 | |
|     height: "100%",
 | |
|     flex: true,
 | |
|     "data-css": "app"
 | |
|   }, sidebarVisible ? /*#__PURE__*/_react.default.createElement(_designSystem.Overlay, {
 | |
|     onClick: () => toggleSidebar(!sidebarVisible)
 | |
|   }) : null, /*#__PURE__*/_react.default.createElement(_sidebar.default, {
 | |
|     isVisible: sidebarVisible,
 | |
|     "data-css": "sidebar"
 | |
|   }), /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
 | |
|     flex: true,
 | |
|     flexGrow: 1,
 | |
|     flexDirection: "column",
 | |
|     overflowY: "auto",
 | |
|     bg: "bg",
 | |
|     "data-css": "app-content"
 | |
|   }, /*#__PURE__*/_react.default.createElement(_topBar.default, {
 | |
|     toggleSidebar: () => toggleSidebar(!sidebarVisible)
 | |
|   }), /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
 | |
|     position: "absolute",
 | |
|     top: 0,
 | |
|     zIndex: 2000,
 | |
|     "data-css": "notice"
 | |
|   }, /*#__PURE__*/_react.default.createElement(_notice.default, null)), /*#__PURE__*/_react.default.createElement(_reactRouterDom.Routes, null, /*#__PURE__*/_react.default.createElement(_reactRouterDom.Route, {
 | |
|     path: `${resourceUrl}/*`,
 | |
|     element: /*#__PURE__*/_react.default.createElement(_routes.ResourceRoute, null)
 | |
|   }), /*#__PURE__*/_react.default.createElement(_reactRouterDom.Route, {
 | |
|     path: pageUrl,
 | |
|     element: /*#__PURE__*/_react.default.createElement(_routes.PageRoute, null)
 | |
|   }), /*#__PURE__*/_react.default.createElement(_reactRouterDom.Route, {
 | |
|     path: dashboardUrl,
 | |
|     element: /*#__PURE__*/_react.default.createElement(_routes.DashboardRoute, null)
 | |
|   })), /*#__PURE__*/_react.default.createElement(_reactRouterDom.Routes, null, /*#__PURE__*/_react.default.createElement(_reactRouterDom.Route, {
 | |
|     path: `${resourceActionUrl}/*`,
 | |
|     element: /*#__PURE__*/_react.default.createElement(_routes.ResourceActionRoute, null)
 | |
|   }), /*#__PURE__*/_react.default.createElement(_reactRouterDom.Route, {
 | |
|     path: `${bulkActionUrl}/*`,
 | |
|     element: /*#__PURE__*/_react.default.createElement(_routes.BulkActionRoute, null)
 | |
|   }), /*#__PURE__*/_react.default.createElement(_reactRouterDom.Route, {
 | |
|     path: `${recordActionUrl}/*`,
 | |
|     element: /*#__PURE__*/_react.default.createElement(_routes.RecordActionRoute, null)
 | |
|   })))));
 | |
| };
 | |
| 
 | |
| var _default = (0, _allowOverride.default)(App, 'Application');
 | |
| 
 | |
| exports.default = _default; |