bananas-commerce-admin 0.1.1 → 0.1.2

package/dist/cjs/containers/Content.js

@@ -3,16 +3,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-var Box_1 = __importDefault(require("@mui/material/Box"));
+var Grid_1 = __importDefault(require("@mui/material/Grid"));
 var react_1 = __importDefault(require("react"));
 var Content = function (_a) {
     var children = _a.children;
-    return (react_1.default.createElement(Box_1.default, { sx: {
-            display: "flex",
-            flexDirection: "column",
+    return (react_1.default.createElement(Grid_1.default, { container: true, sx: {
             position: "relative",
-            flexGrow: 1,
-            padding: 3,
-        } }, children));
+            padding: 2,
+            minWidth: 600,
+            overflow: "scroll",
+        }, spacing: 2 }, children));
 };
 exports.default = Content;

package/dist/cjs/contexts/RouterContext.js

@@ -31,6 +31,7 @@ var routes_1 = require("../router/routes");
 var ApiContext_1 = require("./ApiContext");
 var RouterContext = React.createContext({
     routes: [],
+    getCurrent: function () { return void 0; },
     getRoute: function (reverse) { return void reverse; },
     navigate: function (route, options) { return void [route, options]; },
 });
@@ -64,6 +65,16 @@ var RouterContextProvider = function (_a) {
             page: page,
         });
     }
+    var getCurrent = function () {
+        for (var _i = 0, routes_2 = routes; _i < routes_2.length; _i++) {
+            var route = routes_2[_i];
+            var match = (0, react_router_dom_1.matchPath)(route.path, location.pathname);
+            if (match !== null) {
+                return { route: route, match: match };
+            }
+        }
+        return undefined;
+    };
     var getRoute = function (reverse) {
         return routes.find(function (_a) {
             var id = _a.id;
@@ -100,7 +111,7 @@ var RouterContextProvider = function (_a) {
             search: new URLSearchParams(options === null || options === void 0 ? void 0 : options.query).toString(),
         }, { replace: options === null || options === void 0 ? void 0 : options.replace });
     };
-    return (React.createElement(RouterContext.Provider, { value: { routes: routes, getRoute: getRoute, navigate: navigate } }, children));
+    return (React.createElement(RouterContext.Provider, { value: { routes: routes, getCurrent: getCurrent, getRoute: getRoute, navigate: navigate } }, children));
 };
 exports.RouterContextProvider = RouterContextProvider;
 exports.default = RouterContext;

package/dist/cjs/extensions/bananas/pages/me/list.js

@@ -5,16 +5,22 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
 var Paper_1 = __importDefault(require("@mui/material/Paper"));
-var styles_1 = require("@mui/material/styles");
 var Content_1 = __importDefault(require("../../../../containers/Content"));
 var PasswordChangeForm_1 = __importDefault(require("../../components/PasswordChangeForm"));
+var Grid_1 = __importDefault(require("@mui/material/Grid"));
+var TitleBar_1 = require("../../../../components/TitleBar");
+var UserContext_1 = require("../../../../contexts/UserContext");
 var MePage = function () {
-    var theme = (0, styles_1.useTheme)();
-    return (react_1.default.createElement(Content_1.default, null,
-        react_1.default.createElement(Paper_1.default, { sx: {
-                padding: theme.spacing(3),
-                alignSelf: "flex-start",
-            }, elevation: 1, square: true },
-            react_1.default.createElement(PasswordChangeForm_1.default, null))));
+    var _a;
+    var user = (0, UserContext_1.useUser)().user;
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(TitleBar_1.TitleBar, { title: (_a = user === null || user === void 0 ? void 0 : user.username) !== null && _a !== void 0 ? _a : "Me" }),
+        react_1.default.createElement(Content_1.default, null,
+            react_1.default.createElement(Grid_1.default, { item: true },
+                react_1.default.createElement(Paper_1.default, { sx: {
+                        padding: 3,
+                        alignSelf: "flex-start",
+                    }, elevation: 1, square: true },
+                    react_1.default.createElement(PasswordChangeForm_1.default, null))))));
 };
 exports.default = MePage;

package/dist/cjs/extensions/fulfillment/components/AddressInfo.js

@@ -5,8 +5,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AddressInfo = void 0;
 var react_1 = __importDefault(require("react"));
-var Typography_1 = __importDefault(require("@mui/material/Typography"));
 var Box_1 = __importDefault(require("@mui/material/Box"));
+var Typography_1 = __importDefault(require("@mui/material/Typography"));
 var countryCodeFormatter = new Intl.DisplayNames("sv", { type: "region" });
 var AddressInfo = function (_a) {
     var name = _a.name, streetAddress = _a.streetAddress, streetAddress2 = _a.streetAddress2, careOf = _a.careOf, postalCode = _a.postalCode, city = _a.city, countryCode = _a.countryCode;

package/dist/cjs/extensions/fulfillment/components/ContactInfo.js

@@ -4,15 +4,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ContactInfo = void 0;
-var Link_1 = __importDefault(require("@mui/material/Link"));
 var react_1 = __importDefault(require("react"));
-var Typography_1 = __importDefault(require("@mui/material/Typography"));
 var Box_1 = __importDefault(require("@mui/material/Box"));
+var Link_1 = __importDefault(require("@mui/material/Link"));
+var Typography_1 = __importDefault(require("@mui/material/Typography"));
 var ContactInfo = function (_a) {
     var name = _a.name, email = _a.email, phone = _a.phone;
     return (react_1.default.createElement(Box_1.default, null,
-        react_1.default.createElement(Typography_1.default, { noWrap: true }, "Link"),
-        react_1.default.createElement(Link_1.default, { href: "mailto:".concat(email), noWrap: true }, email),
+        react_1.default.createElement(Typography_1.default, { noWrap: true }, name),
+        email ? react_1.default.createElement(Link_1.default, { href: "mailto:".concat(email), noWrap: true }, email) : null,
         phone ? react_1.default.createElement(Link_1.default, { href: "tel:".concat(phone), noWrap: true }, phone) : null));
 };
 exports.ContactInfo = ContactInfo;

package/dist/cjs/extensions/fulfillment/components/RecipientCard.js

@@ -9,13 +9,13 @@ var Card_1 = __importDefault(require("@mui/material/Card"));
 var CardContent_1 = __importDefault(require("@mui/material/CardContent"));
 var CardHeader_1 = __importDefault(require("@mui/material/CardHeader"));
 var Divider_1 = __importDefault(require("@mui/material/Divider"));
-var styles_1 = require("@mui/material/styles");
 var Grid_1 = __importDefault(require("@mui/material/Grid"));
+var styles_1 = require("@mui/material/styles");
 var Typography_1 = __importDefault(require("@mui/material/Typography"));
 var RecipientCard = function (_a) {
     var recipient = _a.recipient;
     var theme = (0, styles_1.useTheme)();
-    return (react_1.default.createElement(Card_1.default, { sx: { width: 550 } },
+    return (react_1.default.createElement(Card_1.default, null,
         react_1.default.createElement(CardHeader_1.default, { title: "Recipient" }),
         react_1.default.createElement(CardContent_1.default, null,
             react_1.default.createElement(Divider_1.default, { sx: { marginBottom: theme.spacing(2) } }),

package/dist/cjs/extensions/fulfillment/components/SearchBar.js

@@ -25,8 +25,8 @@ var Search_1 = __importDefault(require("@mui/icons-material/Search"));
 var FormControl_1 = __importDefault(require("@mui/material/FormControl"));
 var IconButton_1 = __importDefault(require("@mui/material/IconButton"));
 var styles_1 = require("@mui/material/styles");
-var is_positive_integer_1 = require("../../../util/is_positive_integer");
 var is_email_1 = require("../../../util/is_email");
+var is_positive_integer_1 = require("../../../util/is_positive_integer");
 var ChipIcons = {
     email: AlternateEmail_1.default,
     phone: Phone_1.default,

package/dist/cjs/extensions/fulfillment/components/ShipmentAccordion.js

@@ -5,13 +5,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ShipmentAccordion = void 0;
 var react_1 = __importDefault(require("react"));
+var ExpandMore_1 = __importDefault(require("@mui/icons-material/ExpandMore"));
 var Accordion_1 = __importDefault(require("@mui/material/Accordion"));
 var AccordionDetails_1 = __importDefault(require("@mui/material/AccordionDetails"));
 var AccordionSummary_1 = __importDefault(require("@mui/material/AccordionSummary"));
-var Typography_1 = __importDefault(require("@mui/material/Typography"));
 var Checkbox_1 = __importDefault(require("@mui/material/Checkbox"));
-var ExpandMore_1 = __importDefault(require("@mui/icons-material/ExpandMore"));
 var Grid_1 = __importDefault(require("@mui/material/Grid"));
+var Typography_1 = __importDefault(require("@mui/material/Typography"));
 var ShipmentAccordion = function (_a) {
     var shipment = _a.shipment;
     return (react_1.default.createElement(Accordion_1.default, { sx: { width: "100%" } },

package/dist/cjs/extensions/fulfillment/components/ShipmentDestinationButtons.js

@@ -13,11 +13,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ShipmentDestinationButtons = exports.ALL_SELECTED = void 0;
+var react_1 = __importDefault(require("react"));
 var styles_1 = require("@mui/material/styles");
 var ToggleButton_1 = __importDefault(require("@mui/material/ToggleButton"));
 var ToggleButtonGroup_1 = __importDefault(require("@mui/material/ToggleButtonGroup"));
 var useMediaQuery_1 = __importDefault(require("@mui/material/useMediaQuery"));
-var react_1 = __importDefault(require("react"));
 var ShipmentDestinationIcon_1 = require("./ShipmentDestinationIcon");
 exports.ALL_SELECTED = [
     "HOME",

package/dist/cjs/extensions/fulfillment/components/ShipmentDestinationIcon.js

@@ -27,8 +27,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ShipmentDestinationIcon = void 0;
 var react_1 = __importDefault(require("react"));
-var Home_1 = __importDefault(require("@mui/icons-material/Home"));
 var AllInbox_1 = __importDefault(require("@mui/icons-material/AllInbox"));
+var Home_1 = __importDefault(require("@mui/icons-material/Home"));
 var LocalShipping_1 = __importDefault(require("@mui/icons-material/LocalShipping"));
 var Store_1 = __importDefault(require("@mui/icons-material/Store"));
 var ShipmentDestinationIcon = function (_a) {

package/dist/cjs/extensions/fulfillment/components/ShipmentItemsCard.js

@@ -0,0 +1,129 @@
+"use strict";
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ShipmentItemsCard = void 0;
+var notistack_1 = require("notistack");
+var react_1 = __importDefault(require("react"));
+var Inventory2Outlined_1 = __importDefault(require("@mui/icons-material/Inventory2Outlined"));
+var LoadingButton_1 = __importDefault(require("@mui/lab/LoadingButton"));
+var Card_1 = __importDefault(require("@mui/material/Card"));
+var CardActions_1 = __importDefault(require("@mui/material/CardActions"));
+var CardContent_1 = __importDefault(require("@mui/material/CardContent"));
+var CardHeader_1 = __importDefault(require("@mui/material/CardHeader"));
+var Checkbox_1 = __importDefault(require("@mui/material/Checkbox"));
+var Input_1 = __importDefault(require("@mui/material/Input"));
+var styles_1 = require("@mui/material/styles");
+var Table_1 = __importDefault(require("@mui/material/Table"));
+var TableBody_1 = __importDefault(require("@mui/material/TableBody"));
+var TableCell_1 = __importDefault(require("@mui/material/TableCell"));
+var TableContainer_1 = __importDefault(require("@mui/material/TableContainer"));
+var TableHead_1 = __importDefault(require("@mui/material/TableHead"));
+var TableRow_1 = __importDefault(require("@mui/material/TableRow"));
+var Typography_1 = __importDefault(require("@mui/material/Typography"));
+var ApiContext_1 = require("../../../contexts/ApiContext");
+var ShipmentItemsCard = function (_a) {
+    var shipment = _a.shipment;
+    var theme = (0, styles_1.useTheme)();
+    var api = (0, ApiContext_1.useApi)();
+    var enqueueSnackbar = (0, notistack_1.useSnackbar)().enqueueSnackbar;
+    var _b = react_1.default.useState([]), selected = _b[0], setSelected = _b[1];
+    var _c = react_1.default.useState(false), loading = _c[0], setLoading = _c[1];
+    var _d = react_1.default.useState(false), disabled = _d[0], setDisabled = _d[1];
+    var toggleSelectAll = function (_, checked) {
+        setSelected(checked ? shipment.items : []);
+    };
+    var toggleItem = function (item, checked) {
+        var index = selected.map(function (_a) {
+            var code = _a.code;
+            return code;
+        }).indexOf(item.code);
+        if (checked && index === -1) {
+            setSelected(__spreadArray(__spreadArray([], selected, true), [item], false));
+        }
+        else {
+            var unselected = __spreadArray([], selected, true);
+            unselected.splice(index, 1);
+            setSelected(unselected);
+        }
+    };
+    var itemQuantityChange = function (item) {
+        var index = selected.map(function (_a) {
+            var code = _a.code;
+            return code;
+        }).indexOf(item.code);
+        var changed = __spreadArray([], selected, true);
+        changed[index] = item;
+        setSelected(changed);
+    };
+    var markAsArrived = function () {
+        setLoading(true);
+        api.operations["fulfillment.shipment:arrived"].call({
+            params: { shipment_reference: shipment.shipment_reference },
+            body: selected,
+        }).then(function (response) {
+            if (response.ok) {
+                enqueueSnackbar("Successfully marked shipment items as arrived!", {
+                    variant: "success",
+                });
+                setDisabled(true);
+            }
+            else {
+                enqueueSnackbar("Failed to mark shipment items as arrived, view console for more info", {
+                    variant: "error",
+                });
+                throw response;
+            }
+        }).finally(function () {
+            setLoading(false);
+        });
+    };
+    return (react_1.default.createElement(Card_1.default, null,
+        react_1.default.createElement(CardHeader_1.default, { title: react_1.default.createElement(Typography_1.default, { variant: "h6" },
+                react_1.default.createElement("b", null, "Items")), avatar: react_1.default.createElement(Inventory2Outlined_1.default, null), sx: {
+                borderBottomWidth: 1,
+                borderBottomStyle: "solid",
+                borderBottomColor: theme.palette.divider,
+            } }),
+        react_1.default.createElement(CardContent_1.default, null,
+            react_1.default.createElement(TableContainer_1.default, null,
+                react_1.default.createElement(Table_1.default, null,
+                    react_1.default.createElement(TableHead_1.default, null,
+                        react_1.default.createElement(TableRow_1.default, null,
+                            react_1.default.createElement(TableCell_1.default, { align: "left", padding: "checkbox" },
+                                react_1.default.createElement(Checkbox_1.default, { color: "secondary", indeterminate: selected.length > 0 &&
+                                        selected.length < shipment.items.length, checked: shipment.items.length !== 0 &&
+                                        selected.length === shipment.items.length, onChange: toggleSelectAll, disabled: disabled || shipment.items.length === 0 })),
+                            react_1.default.createElement(TableCell_1.default, { align: "left" }, "Reference"),
+                            react_1.default.createElement(TableCell_1.default, { align: "right" }, "Quantity"))),
+                    react_1.default.createElement(TableBody_1.default, null, shipment.items.map(function (item) {
+                        var isSelected = selected.map(function (_a) {
+                            var code = _a.code;
+                            return code;
+                        }).includes(item.code);
+                        return (react_1.default.createElement(TableRow_1.default, { key: item.code },
+                            react_1.default.createElement(TableCell_1.default, { align: "left", padding: "checkbox" },
+                                react_1.default.createElement(Checkbox_1.default, { disabled: disabled, color: "secondary", checked: isSelected, onChange: function (_, checked) { return toggleItem(item, checked); } })),
+                            react_1.default.createElement(TableCell_1.default, { align: "left" }, item.code),
+                            react_1.default.createElement(TableCell_1.default, { align: "right" },
+                                react_1.default.createElement(Input_1.default, { type: "number", defaultValue: item.quantity, inputProps: { min: 0, max: item.quantity }, disabled: disabled || !isSelected, onChange: function (event) {
+                                        return itemQuantityChange({
+                                            code: item.code,
+                                            quantity: parseInt(event.target.value),
+                                        });
+                                    } }))));
+                    }))))),
+        react_1.default.createElement(CardActions_1.default, { sx: { justifyContent: "end" } },
+            react_1.default.createElement(LoadingButton_1.default, { variant: "contained", color: "secondary", loading: loading, disabled: disabled || loading || selected.length === 0, onClick: markAsArrived }, "Mark as arrived"))));
+};
+exports.ShipmentItemsCard = ShipmentItemsCard;

package/dist/cjs/extensions/fulfillment/components/ShipmentRow.js

@@ -4,9 +4,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ShipmentRow = void 0;
+var react_1 = __importDefault(require("react"));
 var TableCell_1 = __importDefault(require("@mui/material/TableCell"));
 var TableRow_1 = __importDefault(require("@mui/material/TableRow"));
-var react_1 = __importDefault(require("react"));
 var RouterContext_1 = require("../../../contexts/RouterContext");
 var ShipmentRow = function (_a) {
     var _b;

package/dist/cjs/extensions/fulfillment/pages/recipient/detail.js

@@ -7,10 +7,12 @@ var react_1 = __importDefault(require("react"));
 var Content_1 = __importDefault(require("../../../../containers/Content"));
 var ShipmentCard_1 = require("../../components/ShipmentCard");
 var TitleBar_1 = require("../../../../components/TitleBar");
+var Grid_1 = __importDefault(require("@mui/material/Grid"));
 var RecipientDetailPage = function (_a) {
     var recipient = _a.data;
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(TitleBar_1.TitleBar, { back: true, title: "Recipient ".concat(recipient.reference) }),
-        react_1.default.createElement(Content_1.default, null, recipient.shipments.map(function (shipment) { return (react_1.default.createElement(ShipmentCard_1.ShipmentCard, { key: shipment.shipment_reference, shipment: shipment })); }))));
+        react_1.default.createElement(Content_1.default, null, recipient.shipments.map(function (shipment) { return (react_1.default.createElement(Grid_1.default, { item: true, xs: 12 },
+            react_1.default.createElement(ShipmentCard_1.ShipmentCard, { key: shipment.shipment_reference, shipment: shipment }))); }))));
 };
 exports.default = RecipientDetailPage;

package/dist/cjs/extensions/fulfillment/pages/shipment/detail.js

@@ -1,17 +1,51 @@
 "use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
 var Content_1 = __importDefault(require("../../../../containers/Content"));
-var ShipmentCard_1 = require("../../components/ShipmentCard");
 var TitleBar_1 = require("../../../../components/TitleBar");
+var RouterContext_1 = require("../../../../contexts/RouterContext");
+var ShipmentItemsCard_1 = require("../../components/ShipmentItemsCard");
+var Card_1 = __importDefault(require("@mui/material/Card"));
+var CardHeader_1 = __importDefault(require("@mui/material/CardHeader"));
+var CardContent_1 = __importDefault(require("@mui/material/CardContent"));
+var Typography_1 = __importDefault(require("@mui/material/Typography"));
+var Person_1 = __importDefault(require("@mui/icons-material/Person"));
+var ContactInfo_1 = require("../../components/ContactInfo");
+var AddressInfo_1 = require("../../components/AddressInfo");
+var Grid_1 = __importDefault(require("@mui/material/Grid"));
 var ShipmentDetailPage = function (_a) {
-    var shipment = _a.data;
+    var data = _a.data;
+    var getCurrent = (0, RouterContext_1.useRouter)().getCurrent;
+    var shipment = __assign(__assign({}, data), { shipment_reference: getCurrent().match.params.shipment_reference });
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(TitleBar_1.TitleBar, { back: true, title: "Shipment ".concat(shipment.shipment_reference) }),
         react_1.default.createElement(Content_1.default, null,
-            react_1.default.createElement(ShipmentCard_1.ShipmentCard, { key: shipment.shipment_reference, shipment: shipment }))));
+            react_1.default.createElement(Grid_1.default, { item: true, sm: 12, md: 6 },
+                react_1.default.createElement(Card_1.default, null,
+                    react_1.default.createElement(CardHeader_1.default, { title: react_1.default.createElement(Typography_1.default, { variant: "h6" },
+                            react_1.default.createElement("b", null, "Info")), avatar: react_1.default.createElement(Person_1.default, null), sx: {
+                            borderBottomWidth: 1,
+                            borderBottomStyle: "solid",
+                            borderBottomColor: "divider",
+                        } }),
+                    react_1.default.createElement(CardContent_1.default, null,
+                        react_1.default.createElement(ContactInfo_1.ContactInfo, { name: shipment.name }),
+                        react_1.default.createElement(AddressInfo_1.AddressInfo, { streetAddress: shipment.street_address, streetAddress2: shipment.street_address2, careOf: shipment.care_of, postalCode: shipment.postal_code, city: shipment.city, countryCode: shipment.country_code })))),
+            react_1.default.createElement(Grid_1.default, { item: true, sm: 12, md: 6 },
+                react_1.default.createElement(ShipmentItemsCard_1.ShipmentItemsCard, { shipment: shipment })))));
 };
 exports.default = ShipmentDetailPage;

package/dist/cjs/extensions/fulfillment/pages/shipment/list.js

@@ -22,6 +22,7 @@ var SearchBar_1 = require("../../components/SearchBar");
 var ShipmentCard_1 = require("../../components/ShipmentCard");
 var ShipmentDestinationButtons_1 = require("../../components/ShipmentDestinationButtons");
 var TitleBar_1 = require("../../../../components/TitleBar");
+var Grid_1 = __importDefault(require("@mui/material/Grid"));
 var ShipmentListPage = function (_a) {
     var _b = _a.data, _next = _b.next, _previous = _b.previous, results = _b.results;
     var theme = (0, styles_1.useTheme)();
@@ -40,15 +41,16 @@ var ShipmentListPage = function (_a) {
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(TitleBar_1.TitleBar, { title: "Shipments" }),
         react_1.default.createElement(Content_1.default, null,
-            react_1.default.createElement(Box_1.default, { sx: {
-                    width: "100%",
-                    display: "flex",
-                    flexDirection: "column",
-                    gap: theme.spacing(1),
-                    marginBottom: theme.spacing(2),
-                }, component: "form", onSubmit: doSearch },
-                react_1.default.createElement(SearchBar_1.SearchBar, { defaultValue: searchInputs, onChange: function (inputs) { return setSearchInputs(inputs); } }),
-                react_1.default.createElement(ShipmentDestinationButtons_1.ShipmentDestinationButtons, { defaultSelected: destinationTypes, onChange: function (selected) { return setDestinationTypes(selected); } })),
-            react_1.default.createElement(Stack_1.default, { gap: 1 }, results.map(function (shipment) { return (react_1.default.createElement(ShipmentCard_1.ShipmentCard, { key: shipment.shipment_reference, shipment: shipment })); })))));
+            react_1.default.createElement(Grid_1.default, { item: true, xs: 12 },
+                react_1.default.createElement(Box_1.default, { sx: {
+                        width: "100%",
+                        display: "flex",
+                        flexDirection: "column",
+                        gap: theme.spacing(1),
+                        marginBottom: theme.spacing(2),
+                    }, component: "form", onSubmit: doSearch },
+                    react_1.default.createElement(SearchBar_1.SearchBar, { defaultValue: searchInputs, onChange: function (inputs) { return setSearchInputs(inputs); } }),
+                    react_1.default.createElement(ShipmentDestinationButtons_1.ShipmentDestinationButtons, { defaultSelected: destinationTypes, onChange: function (selected) { return setDestinationTypes(selected); } })),
+                react_1.default.createElement(Stack_1.default, { gap: 1 }, results.map(function (shipment) { return (react_1.default.createElement(ShipmentCard_1.ShipmentCard, { key: shipment.shipment_reference, shipment: shipment })); }))))));
 };
 exports.default = ShipmentListPage;

package/dist/cjs/extensions/pos/components/ReceiptCard.js

@@ -64,7 +64,7 @@ var ReceiptCard = function (_a) {
     var _b;
     var receipt = _a.receipt;
     var theme = (0, styles_1.useTheme)();
-    return (react_1.default.createElement(Card_1.default, { sx: { width: 550 } },
+    return (react_1.default.createElement(Card_1.default, null,
         react_1.default.createElement(CardHeader_1.default, { title: react_1.default.createElement(Typography_1.default, { variant: "h6" },
                 react_1.default.createElement("b", null, "Receipt")), avatar: react_1.default.createElement(Receipt_1.default, null), action: react_1.default.createElement(IconButton_1.default, { "aria-label": "settings" },
                 react_1.default.createElement(MoreVert_1.default, null)), sx: {

package/dist/cjs/extensions/pos/pages/purchase/detail.js

@@ -8,10 +8,12 @@ var ReceiptCard_1 = require("../../components/ReceiptCard");
 var Content_1 = __importDefault(require("../../../../containers/Content"));
 var TitleBar_1 = require("../../../../components/TitleBar");
 var format_purchase_number_1 = require("../../../../util/format_purchase_number");
+var Grid_1 = __importDefault(require("@mui/material/Grid"));
 var PurchaseDetailPage = function (_a) {
     var _b = _a.data, purchase = _b.purchase, receipts = _b.receipts;
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(TitleBar_1.TitleBar, { back: true, title: "Purchase ".concat((0, format_purchase_number_1.formatPurchaseNumber)(purchase.number)) }),
-        react_1.default.createElement(Content_1.default, null, receipts.map(function (receipt, i) { return (react_1.default.createElement(ReceiptCard_1.ReceiptCard, { key: receipt.number, receipt: receipt })); }))));
+        react_1.default.createElement(Content_1.default, null, receipts.map(function (receipt, i) { return (react_1.default.createElement(Grid_1.default, { item: true, sm: 12, md: 6 },
+            react_1.default.createElement(ReceiptCard_1.ReceiptCard, { key: receipt.number, receipt: receipt }))); }))));
 };
 exports.default = PurchaseDetailPage;

package/dist/cjs/extensions/pos/pages/purchase/list.js

@@ -4,7 +4,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
-var Box_1 = __importDefault(require("@mui/material/Box"));
 var Paper_1 = __importDefault(require("@mui/material/Paper"));
 var Table_1 = __importDefault(require("@mui/material/Table"));
 var TableBody_1 = __importDefault(require("@mui/material/TableBody"));
@@ -15,12 +14,13 @@ var TableRow_1 = __importDefault(require("@mui/material/TableRow"));
 var Content_1 = __importDefault(require("../../../../containers/Content"));
 var PurchaseRow_1 = require("../../components/PurchaseRow");
 var TitleBar_1 = require("../../../../components/TitleBar");
+var Grid_1 = __importDefault(require("@mui/material/Grid"));
 var PurchaseListPage = function (_a) {
     var data = _a.data;
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(TitleBar_1.TitleBar, { title: "Purchases" }),
         react_1.default.createElement(Content_1.default, null,
-            react_1.default.createElement(Box_1.default, { sx: { width: "100%" } },
+            react_1.default.createElement(Grid_1.default, { item: true, xs: 12 },
                 react_1.default.createElement(TableContainer_1.default, { component: Paper_1.default },
                     react_1.default.createElement(Table_1.default, null,
                         react_1.default.createElement(TableHead_1.default, null,

package/dist/cjs/pages/DashboardPage.js

@@ -4,7 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
-var DashboardPage = function (_a) {
+var DashboardPage = function () {
     return react_1.default.createElement("h1", null, "Dashboard!");
 };
 exports.default = DashboardPage;

package/dist/cjs/router/routes.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getTitle = exports.getPage = exports.getPath = exports.isNavigation = exports.parseOperationId = void 0;
+exports.getTitle = exports.getView = exports.getAppLabel = exports.getPage = exports.getPath = exports.isNavigation = exports.parseOperationId = void 0;
 var util_1 = require("../util");
 /**
  * Parses an `operationId` returning app, view and action
@@ -48,9 +48,11 @@ function getAppLabel(tags) {
     var _a;
     return (_a = tags.filter(function (tag) { return tag.startsWith("app:"); })[0]) === null || _a === void 0 ? void 0 : _a.split(":")[1];
 }
+exports.getAppLabel = getAppLabel;
 function getView(id) {
     return id.substring(id.indexOf(".") + 1, id.indexOf(":"));
 }
+exports.getView = getView;
 function getTitle(view, summary) {
     return (summary !== null && summary !== void 0 ? summary : (view && (0, util_1.capitalize)(view.replace("_", " "))));
 }

package/dist/esm/containers/Content.js

@@ -1,13 +1,12 @@
-import Box from "@mui/material/Box";
+import Grid from "@mui/material/Grid";
 import React from "react";
 var Content = function (_a) {
     var children = _a.children;
-    return (React.createElement(Box, { sx: {
-            display: "flex",
-            flexDirection: "column",
+    return (React.createElement(Grid, { container: true, sx: {
             position: "relative",
-            flexGrow: 1,
-            padding: 3,
-        } }, children));
+            padding: 2,
+            minWidth: 600,
+            overflow: "scroll",
+        }, spacing: 2 }, children));
 };
 export default Content;

package/dist/esm/contexts/RouterContext.js

@@ -1,10 +1,11 @@
 import { useSnackbar } from "notistack";
 import * as React from "react";
-import { useNavigate } from "react-router-dom";
+import { matchPath, useNavigate } from "react-router-dom";
 import { getPage, getPath, getTitle, isNavigation, parseOperationId, } from "../router/routes";
 import { useApi } from "./ApiContext";
 var RouterContext = React.createContext({
     routes: [],
+    getCurrent: function () { return void 0; },
     getRoute: function (reverse) { return void reverse; },
     navigate: function (route, options) { return void [route, options]; },
 });
@@ -37,6 +38,16 @@ export var RouterContextProvider = function (_a) {
             page: page,
         });
     }
+    var getCurrent = function () {
+        for (var _i = 0, routes_1 = routes; _i < routes_1.length; _i++) {
+            var route = routes_1[_i];
+            var match = matchPath(route.path, location.pathname);
+            if (match !== null) {
+                return { route: route, match: match };
+            }
+        }
+        return undefined;
+    };
     var getRoute = function (reverse) {
         return routes.find(function (_a) {
             var id = _a.id;
@@ -73,6 +84,6 @@ export var RouterContextProvider = function (_a) {
             search: new URLSearchParams(options === null || options === void 0 ? void 0 : options.query).toString(),
         }, { replace: options === null || options === void 0 ? void 0 : options.replace });
     };
-    return (React.createElement(RouterContext.Provider, { value: { routes: routes, getRoute: getRoute, navigate: navigate } }, children));
+    return (React.createElement(RouterContext.Provider, { value: { routes: routes, getCurrent: getCurrent, getRoute: getRoute, navigate: navigate } }, children));
 };
 export default RouterContext;

package/dist/esm/extensions/bananas/pages/me/list.js

@@ -1,15 +1,21 @@
 import React from "react";
 import Paper from "@mui/material/Paper";
-import { useTheme } from "@mui/material/styles";
 import Content from "../../../../containers/Content";
 import PasswordChangeForm from "../../components/PasswordChangeForm";
+import Grid from "@mui/material/Grid";
+import { TitleBar } from "../../../../components/TitleBar";
+import { useUser } from "../../../../contexts/UserContext";
 var MePage = function () {
-    var theme = useTheme();
-    return (React.createElement(Content, null,
-        React.createElement(Paper, { sx: {
-                padding: theme.spacing(3),
-                alignSelf: "flex-start",
-            }, elevation: 1, square: true },
-            React.createElement(PasswordChangeForm, null))));
+    var _a;
+    var user = useUser().user;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(TitleBar, { title: (_a = user === null || user === void 0 ? void 0 : user.username) !== null && _a !== void 0 ? _a : "Me" }),
+        React.createElement(Content, null,
+            React.createElement(Grid, { item: true },
+                React.createElement(Paper, { sx: {
+                        padding: 3,
+                        alignSelf: "flex-start",
+                    }, elevation: 1, square: true },
+                    React.createElement(PasswordChangeForm, null))))));
 };
 export default MePage;

package/dist/esm/extensions/fulfillment/components/AddressInfo.js

@@ -1,6 +1,6 @@
 import React from "react";
-import Typography from "@mui/material/Typography";
 import Box from "@mui/material/Box";
+import Typography from "@mui/material/Typography";
 var countryCodeFormatter = new Intl.DisplayNames("sv", { type: "region" });
 export var AddressInfo = function (_a) {
     var name = _a.name, streetAddress = _a.streetAddress, streetAddress2 = _a.streetAddress2, careOf = _a.careOf, postalCode = _a.postalCode, city = _a.city, countryCode = _a.countryCode;