@webiny/app-security-access-management 0.0.0-mt-2 → 0.0.0-unstable.06b2ede40f

package/ui/views/Teams/TeamsDataList.js

@@ -0,0 +1,151 @@
+import React, { useCallback, useMemo, useState } from "react";
+import orderBy from "lodash/orderBy";
+import { Button, Grid, Select, Tooltip } from "@webiny/admin-ui";
+import { ReactComponent as AddIcon } from "@webiny/icons/add.svg";
+import { i18n } from "@webiny/app/i18n";
+import { DataList, ScrollList, ListItem, ListItemText, ListItemTextSecondary, ListItemMeta, DataListModalOverlayAction, DataListModalOverlay, ListItemTextPrimary, ListActions } from "@webiny/ui/List";
+import { DeleteIcon } from "@webiny/ui/List/DataList/icons";
+import { useRouter } from "@webiny/react-router";
+import { useSnackbar } from "@webiny/app-admin/hooks/useSnackbar";
+import { useQuery, useMutation } from "@apollo/react-hooks";
+import { useConfirmationDialog } from "@webiny/app-admin/hooks/useConfirmationDialog";
+import { LIST_TEAMS, DELETE_TEAM } from "./graphql";
+import SearchUI from "@webiny/app-admin/components/SearchUI";
+import { deserializeSorters } from "../utils";
+const t = i18n.ns("app-security/admin/teams/data-list");
+const SORTERS = [{
+  label: t`Newest to oldest`,
+  sorter: "createdOn_DESC"
+}, {
+  label: t`Oldest to newest`,
+  sorter: "createdOn_ASC"
+}, {
+  label: t`Name A-Z`,
+  sorter: "name_ASC"
+}, {
+  label: t`Name Z-A`,
+  sorter: "name_DESC"
+}];
+export const TeamsDataList = () => {
+  const [filter, setFilter] = useState("");
+  const [sort, setSort] = useState(SORTERS[0].sorter);
+  const {
+    history,
+    location
+  } = useRouter();
+  const {
+    showSnackbar
+  } = useSnackbar();
+  const {
+    showConfirmation
+  } = useConfirmationDialog({
+    dataTestId: "default-data-list.delete-dialog"
+  });
+  const {
+    data: listResponse,
+    loading: listLoading
+  } = useQuery(LIST_TEAMS);
+  const [deleteIt, {
+    loading: deleteLoading
+  }] = useMutation(DELETE_TEAM, {
+    refetchQueries: [{
+      query: LIST_TEAMS
+    }]
+  });
+  const data = listLoading && !listResponse ? [] : listResponse?.security.teams.data || [];
+  const id = new URLSearchParams(location.search).get("id");
+  const filterTeam = useCallback(({
+    name,
+    slug,
+    description
+  }) => {
+    return name.toLowerCase().includes(filter) || slug.toLowerCase().includes(filter) || description && description.toLowerCase().includes(filter);
+  }, [filter]);
+  const sortTeams = useCallback(teams => {
+    if (!sort) {
+      return teams;
+    }
+    const [key, sortBy] = deserializeSorters(sort);
+    return orderBy(teams, [key], [sortBy]);
+  }, [sort]);
+  const deleteItem = useCallback(item => {
+    showConfirmation(async () => {
+      const {
+        data
+      } = await deleteIt({
+        variables: item
+      });
+      const {
+        error
+      } = data.security.deleteTeam;
+      if (error) {
+        return showSnackbar(error.message);
+      }
+      showSnackbar(t`Team "{slug}" deleted.`({
+        slug: item.slug
+      }));
+      if (id === item.id) {
+        history.push(`/access-management/teams`);
+      }
+    });
+  }, [id]);
+  const teamsDataListModalOverlay = useMemo(() => /*#__PURE__*/React.createElement(DataListModalOverlay, null, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Grid.Column, {
+    span: 12
+  }, /*#__PURE__*/React.createElement(Select, {
+    value: sort,
+    onChange: setSort,
+    label: t`Sort by`,
+    options: SORTERS.map(({
+      label,
+      sorter: value
+    }) => {
+      return {
+        label,
+        value
+      };
+    })
+  })))), [sort]);
+  const filteredData = filter === "" ? data : data.filter(filterTeam);
+  const teamList = sortTeams(filteredData);
+  return /*#__PURE__*/React.createElement(DataList, {
+    title: t`Teams`,
+    actions: /*#__PURE__*/React.createElement(Button, {
+      text: t`New`,
+      icon: /*#__PURE__*/React.createElement(AddIcon, null),
+      size: "sm",
+      className: "wby-ml-xs",
+      "data-testid": "new-record-button",
+      onClick: () => history.push("/access-management/teams?new=true")
+    }),
+    data: teamList,
+    loading: listLoading || deleteLoading,
+    search: /*#__PURE__*/React.createElement(SearchUI, {
+      value: filter,
+      onChange: setFilter,
+      inputPlaceholder: t`Search teams...`
+    }),
+    modalOverlay: teamsDataListModalOverlay,
+    modalOverlayAction: /*#__PURE__*/React.createElement(DataListModalOverlayAction, {
+      "data-testid": "default-data-list.filter"
+    })
+  }, ({
+    data
+  }) => /*#__PURE__*/React.createElement(ScrollList, {
+    "data-testid": "default-data-list"
+  }, data.map(item => /*#__PURE__*/React.createElement(ListItem, {
+    key: item.id,
+    selected: item.id === id
+  }, /*#__PURE__*/React.createElement(ListItemText, {
+    onClick: () => history.push(`/access-management/teams?id=${item.id}`)
+  }, /*#__PURE__*/React.createElement(ListItemTextPrimary, null, item.name), /*#__PURE__*/React.createElement(ListItemTextSecondary, null, item.description)), /*#__PURE__*/React.createElement(ListItemMeta, null, /*#__PURE__*/React.createElement(ListActions, null, item.system || item.plugin ? /*#__PURE__*/React.createElement(Tooltip, {
+    content: /*#__PURE__*/React.createElement("span", null, item.system ? t`Cannot delete system teams.` : t`Cannot delete teams created via extensions.`),
+    trigger: /*#__PURE__*/React.createElement(DeleteIcon, {
+      disabled: true
+    })
+  }) : /*#__PURE__*/React.createElement(DeleteIcon, {
+    onClick: () => deleteItem(item),
+    "data-testid": "default-data-list.delete"
+  })))))));
+};
+
+//# sourceMappingURL=TeamsDataList.js.map

package/ui/views/Teams/TeamsDataList.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","useMemo","useState","orderBy","Button","Grid","Select","Tooltip","ReactComponent","AddIcon","i18n","DataList","ScrollList","ListItem","ListItemText","ListItemTextSecondary","ListItemMeta","DataListModalOverlayAction","DataListModalOverlay","ListItemTextPrimary","ListActions","DeleteIcon","useRouter","useSnackbar","useQuery","useMutation","useConfirmationDialog","LIST_TEAMS","DELETE_TEAM","SearchUI","deserializeSorters","t","ns","SORTERS","label","sorter","TeamsDataList","filter","setFilter","sort","setSort","history","location","showSnackbar","showConfirmation","dataTestId","data","listResponse","loading","listLoading","deleteIt","deleteLoading","refetchQueries","query","security","teams","id","URLSearchParams","search","get","filterTeam","name","slug","description","toLowerCase","includes","sortTeams","key","sortBy","deleteItem","item","variables","error","deleteTeam","message","push","teamsDataListModalOverlay","createElement","Column","span","value","onChange","options","map","filteredData","teamList","title","actions","text","icon","size","className","onClick","inputPlaceholder","modalOverlay","modalOverlayAction","selected","system","plugin","content","trigger","disabled"],"sources":["TeamsDataList.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState } from \"react\";\nimport orderBy from \"lodash/orderBy\";\nimport { Button, Grid, Select, Tooltip } from \"@webiny/admin-ui\";\nimport { ReactComponent as AddIcon } from \"@webiny/icons/add.svg\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport {\n    DataList,\n    ScrollList,\n    ListItem,\n    ListItemText,\n    ListItemTextSecondary,\n    ListItemMeta,\n    DataListModalOverlayAction,\n    DataListModalOverlay,\n    ListItemTextPrimary,\n    ListActions\n} from \"@webiny/ui/List\";\nimport { DeleteIcon } from \"@webiny/ui/List/DataList/icons\";\nimport { useRouter } from \"@webiny/react-router\";\nimport { useSnackbar } from \"@webiny/app-admin/hooks/useSnackbar\";\nimport { useQuery, useMutation } from \"@apollo/react-hooks\";\nimport { useConfirmationDialog } from \"@webiny/app-admin/hooks/useConfirmationDialog\";\nimport type { ListTeamsResponse } from \"./graphql\";\nimport { LIST_TEAMS, DELETE_TEAM } from \"./graphql\";\nimport SearchUI from \"@webiny/app-admin/components/SearchUI\";\nimport { deserializeSorters } from \"../utils\";\nimport type { Team } from \"~/types\";\n\nconst t = i18n.ns(\"app-security/admin/teams/data-list\");\n\nconst SORTERS = [\n    {\n        label: t`Newest to oldest`,\n        sorter: \"createdOn_DESC\"\n    },\n    {\n        label: t`Oldest to newest`,\n        sorter: \"createdOn_ASC\"\n    },\n    {\n        label: t`Name A-Z`,\n        sorter: \"name_ASC\"\n    },\n    {\n        label: t`Name Z-A`,\n        sorter: \"name_DESC\"\n    }\n];\n\nexport interface TeamsDataListProps {\n    // TODO @ts-refactor delete and go up the tree and sort it out\n    [key: string]: any;\n}\n\nexport const TeamsDataList = () => {\n    const [filter, setFilter] = useState(\"\");\n    const [sort, setSort] = useState(SORTERS[0].sorter);\n    const { history, location } = useRouter();\n    const { showSnackbar } = useSnackbar();\n    const { showConfirmation } = useConfirmationDialog({\n        dataTestId: \"default-data-list.delete-dialog\"\n    });\n\n    const { data: listResponse, loading: listLoading } = useQuery<ListTeamsResponse>(LIST_TEAMS);\n\n    const [deleteIt, { loading: deleteLoading }] = useMutation(DELETE_TEAM, {\n        refetchQueries: [{ query: LIST_TEAMS }]\n    });\n\n    const data = listLoading && !listResponse ? [] : listResponse?.security.teams.data || [];\n    const id = new URLSearchParams(location.search).get(\"id\");\n\n    const filterTeam = useCallback(\n        ({ name, slug, description }: Team) => {\n            return (\n                name.toLowerCase().includes(filter) ||\n                slug.toLowerCase().includes(filter) ||\n                (description && description.toLowerCase().includes(filter))\n            );\n        },\n        [filter]\n    );\n\n    const sortTeams = useCallback(\n        (teams: Team[]) => {\n            if (!sort) {\n                return teams;\n            }\n            const [key, sortBy] = deserializeSorters(sort);\n            return orderBy(teams, [key], [sortBy]);\n        },\n        [sort]\n    );\n\n    const deleteItem = useCallback(\n        (item: Team) => {\n            showConfirmation(async () => {\n                const { data } = await deleteIt({\n                    variables: item\n                });\n\n                const { error } = data.security.deleteTeam;\n                if (error) {\n                    return showSnackbar(error.message);\n                }\n\n                showSnackbar(t`Team \"{slug}\" deleted.`({ slug: item.slug }));\n\n                if (id === item.id) {\n                    history.push(`/access-management/teams`);\n                }\n            });\n        },\n        [id]\n    );\n\n    const teamsDataListModalOverlay = useMemo(\n        () => (\n            <DataListModalOverlay>\n                <Grid>\n                    <Grid.Column span={12}>\n                        <Select\n                            value={sort}\n                            onChange={setSort}\n                            label={t`Sort by`}\n                            options={SORTERS.map(({ label, sorter: value }) => {\n                                return {\n                                    label,\n                                    value\n                                };\n                            })}\n                        />\n                    </Grid.Column>\n                </Grid>\n            </DataListModalOverlay>\n        ),\n        [sort]\n    );\n\n    const filteredData = filter === \"\" ? data : data.filter(filterTeam);\n    const teamList = sortTeams(filteredData);\n\n    return (\n        <DataList\n            title={t`Teams`}\n            actions={\n                <Button\n                    text={t`New`}\n                    icon={<AddIcon />}\n                    size={\"sm\"}\n                    className={\"wby-ml-xs\"}\n                    data-testid=\"new-record-button\"\n                    onClick={() => history.push(\"/access-management/teams?new=true\")}\n                />\n            }\n            data={teamList}\n            loading={listLoading || deleteLoading}\n            search={\n                <SearchUI\n                    value={filter}\n                    onChange={setFilter}\n                    inputPlaceholder={t`Search teams...`}\n                />\n            }\n            modalOverlay={teamsDataListModalOverlay}\n            modalOverlayAction={\n                <DataListModalOverlayAction data-testid={\"default-data-list.filter\"} />\n            }\n        >\n            {({ data }: { data: Team[] }) => (\n                <ScrollList data-testid=\"default-data-list\">\n                    {data.map(item => (\n                        <ListItem key={item.id} selected={item.id === id}>\n                            <ListItemText\n                                onClick={() =>\n                                    history.push(`/access-management/teams?id=${item.id}`)\n                                }\n                            >\n                                <ListItemTextPrimary>{item.name}</ListItemTextPrimary>\n                                <ListItemTextSecondary>{item.description}</ListItemTextSecondary>\n                            </ListItemText>\n\n                            <ListItemMeta>\n                                <ListActions>\n                                    {item.system || item.plugin ? (\n                                        <Tooltip\n                                            content={\n                                                <span>\n                                                    {item.system\n                                                        ? t`Cannot delete system teams.`\n                                                        : t`Cannot delete teams created via extensions.`}\n                                                </span>\n                                            }\n                                            trigger={<DeleteIcon disabled />}\n                                        />\n                                    ) : (\n                                        <DeleteIcon\n                                            onClick={() => deleteItem(item)}\n                                            data-testid={\"default-data-list.delete\"}\n                                        />\n                                    )}\n                                </ListActions>\n                            </ListItemMeta>\n                        </ListItem>\n                    ))}\n                </ScrollList>\n            )}\n        </DataList>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AAC7D,OAAOC,OAAO,MAAM,gBAAgB;AACpC,SAASC,MAAM,EAAEC,IAAI,EAAEC,MAAM,EAAEC,OAAO,QAAQ,kBAAkB;AAChE,SAASC,cAAc,IAAIC,OAAO,QAAQ,uBAAuB;AACjE,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SACIC,QAAQ,EACRC,UAAU,EACVC,QAAQ,EACRC,YAAY,EACZC,qBAAqB,EACrBC,YAAY,EACZC,0BAA0B,EAC1BC,oBAAoB,EACpBC,mBAAmB,EACnBC,WAAW,QACR,iBAAiB;AACxB,SAASC,UAAU,QAAQ,gCAAgC;AAC3D,SAASC,SAAS,QAAQ,sBAAsB;AAChD,SAASC,WAAW,QAAQ,qCAAqC;AACjE,SAASC,QAAQ,EAAEC,WAAW,QAAQ,qBAAqB;AAC3D,SAASC,qBAAqB,QAAQ,+CAA+C;AAErF,SAASC,UAAU,EAAEC,WAAW;AAChC,OAAOC,QAAQ,MAAM,uCAAuC;AAC5D,SAASC,kBAAkB;AAG3B,MAAMC,CAAC,GAAGrB,IAAI,CAACsB,EAAE,CAAC,oCAAoC,CAAC;AAEvD,MAAMC,OAAO,GAAG,CACZ;EACIC,KAAK,EAAEH,CAAC,kBAAkB;EAC1BI,MAAM,EAAE;AACZ,CAAC,EACD;EACID,KAAK,EAAEH,CAAC,kBAAkB;EAC1BI,MAAM,EAAE;AACZ,CAAC,EACD;EACID,KAAK,EAAEH,CAAC,UAAU;EAClBI,MAAM,EAAE;AACZ,CAAC,EACD;EACID,KAAK,EAAEH,CAAC,UAAU;EAClBI,MAAM,EAAE;AACZ,CAAC,CACJ;AAOD,OAAO,MAAMC,aAAa,GAAGA,CAAA,KAAM;EAC/B,MAAM,CAACC,MAAM,EAAEC,SAAS,CAAC,GAAGpC,QAAQ,CAAC,EAAE,CAAC;EACxC,MAAM,CAACqC,IAAI,EAAEC,OAAO,CAAC,GAAGtC,QAAQ,CAAC+B,OAAO,CAAC,CAAC,CAAC,CAACE,MAAM,CAAC;EACnD,MAAM;IAAEM,OAAO;IAAEC;EAAS,CAAC,GAAGpB,SAAS,CAAC,CAAC;EACzC,MAAM;IAAEqB;EAAa,CAAC,GAAGpB,WAAW,CAAC,CAAC;EACtC,MAAM;IAAEqB;EAAiB,CAAC,GAAGlB,qBAAqB,CAAC;IAC/CmB,UAAU,EAAE;EAChB,CAAC,CAAC;EAEF,MAAM;IAAEC,IAAI,EAAEC,YAAY;IAAEC,OAAO,EAAEC;EAAY,CAAC,GAAGzB,QAAQ,CAAoBG,UAAU,CAAC;EAE5F,MAAM,CAACuB,QAAQ,EAAE;IAAEF,OAAO,EAAEG;EAAc,CAAC,CAAC,GAAG1B,WAAW,CAACG,WAAW,EAAE;IACpEwB,cAAc,EAAE,CAAC;MAAEC,KAAK,EAAE1B;IAAW,CAAC;EAC1C,CAAC,CAAC;EAEF,MAAMmB,IAAI,GAAGG,WAAW,IAAI,CAACF,YAAY,GAAG,EAAE,GAAGA,YAAY,EAAEO,QAAQ,CAACC,KAAK,CAACT,IAAI,IAAI,EAAE;EACxF,MAAMU,EAAE,GAAG,IAAIC,eAAe,CAACf,QAAQ,CAACgB,MAAM,CAAC,CAACC,GAAG,CAAC,IAAI,CAAC;EAEzD,MAAMC,UAAU,GAAG5D,WAAW,CAC1B,CAAC;IAAE6D,IAAI;IAAEC,IAAI;IAAEC;EAAkB,CAAC,KAAK;IACnC,OACIF,IAAI,CAACG,WAAW,CAAC,CAAC,CAACC,QAAQ,CAAC5B,MAAM,CAAC,IACnCyB,IAAI,CAACE,WAAW,CAAC,CAAC,CAACC,QAAQ,CAAC5B,MAAM,CAAC,IAClC0B,WAAW,IAAIA,WAAW,CAACC,WAAW,CAAC,CAAC,CAACC,QAAQ,CAAC5B,MAAM,CAAE;EAEnE,CAAC,EACD,CAACA,MAAM,CACX,CAAC;EAED,MAAM6B,SAAS,GAAGlE,WAAW,CACxBuD,KAAa,IAAK;IACf,IAAI,CAAChB,IAAI,EAAE;MACP,OAAOgB,KAAK;IAChB;IACA,MAAM,CAACY,GAAG,EAAEC,MAAM,CAAC,GAAGtC,kBAAkB,CAACS,IAAI,CAAC;IAC9C,OAAOpC,OAAO,CAACoD,KAAK,EAAE,CAACY,GAAG,CAAC,EAAE,CAACC,MAAM,CAAC,CAAC;EAC1C,CAAC,EACD,CAAC7B,IAAI,CACT,CAAC;EAED,MAAM8B,UAAU,GAAGrE,WAAW,CACzBsE,IAAU,IAAK;IACZ1B,gBAAgB,CAAC,YAAY;MACzB,MAAM;QAAEE;MAAK,CAAC,GAAG,MAAMI,QAAQ,CAAC;QAC5BqB,SAAS,EAAED;MACf,CAAC,CAAC;MAEF,MAAM;QAAEE;MAAM,CAAC,GAAG1B,IAAI,CAACQ,QAAQ,CAACmB,UAAU;MAC1C,IAAID,KAAK,EAAE;QACP,OAAO7B,YAAY,CAAC6B,KAAK,CAACE,OAAO,CAAC;MACtC;MAEA/B,YAAY,CAACZ,CAAC,wBAAwB,CAAC;QAAE+B,IAAI,EAAEQ,IAAI,CAACR;MAAK,CAAC,CAAC,CAAC;MAE5D,IAAIN,EAAE,KAAKc,IAAI,CAACd,EAAE,EAAE;QAChBf,OAAO,CAACkC,IAAI,CAAC,0BAA0B,CAAC;MAC5C;IACJ,CAAC,CAAC;EACN,CAAC,EACD,CAACnB,EAAE,CACP,CAAC;EAED,MAAMoB,yBAAyB,GAAG3E,OAAO,CACrC,mBACIF,KAAA,CAAA8E,aAAA,CAAC3D,oBAAoB,qBACjBnB,KAAA,CAAA8E,aAAA,CAACxE,IAAI,qBACDN,KAAA,CAAA8E,aAAA,CAACxE,IAAI,CAACyE,MAAM;IAACC,IAAI,EAAE;EAAG,gBAClBhF,KAAA,CAAA8E,aAAA,CAACvE,MAAM;IACH0E,KAAK,EAAEzC,IAAK;IACZ0C,QAAQ,EAAEzC,OAAQ;IAClBN,KAAK,EAAEH,CAAC,SAAU;IAClBmD,OAAO,EAAEjD,OAAO,CAACkD,GAAG,CAAC,CAAC;MAAEjD,KAAK;MAAEC,MAAM,EAAE6C;IAAM,CAAC,KAAK;MAC/C,OAAO;QACH9C,KAAK;QACL8C;MACJ,CAAC;IACL,CAAC;EAAE,CACN,CACQ,CACX,CACY,CACzB,EACD,CAACzC,IAAI,CACT,CAAC;EAED,MAAM6C,YAAY,GAAG/C,MAAM,KAAK,EAAE,GAAGS,IAAI,GAAGA,IAAI,CAACT,MAAM,CAACuB,UAAU,CAAC;EACnE,MAAMyB,QAAQ,GAAGnB,SAAS,CAACkB,YAAY,CAAC;EAExC,oBACIrF,KAAA,CAAA8E,aAAA,CAAClE,QAAQ;IACL2E,KAAK,EAAEvD,CAAC,OAAQ;IAChBwD,OAAO,eACHxF,KAAA,CAAA8E,aAAA,CAACzE,MAAM;MACHoF,IAAI,EAAEzD,CAAC,KAAM;MACb0D,IAAI,eAAE1F,KAAA,CAAA8E,aAAA,CAACpE,OAAO,MAAE,CAAE;MAClBiF,IAAI,EAAE,IAAK;MACXC,SAAS,EAAE,WAAY;MACvB,eAAY,mBAAmB;MAC/BC,OAAO,EAAEA,CAAA,KAAMnD,OAAO,CAACkC,IAAI,CAAC,mCAAmC;IAAE,CACpE,CACJ;IACD7B,IAAI,EAAEuC,QAAS;IACfrC,OAAO,EAAEC,WAAW,IAAIE,aAAc;IACtCO,MAAM,eACF3D,KAAA,CAAA8E,aAAA,CAAChD,QAAQ;MACLmD,KAAK,EAAE3C,MAAO;MACd4C,QAAQ,EAAE3C,SAAU;MACpBuD,gBAAgB,EAAE9D,CAAC;IAAkB,CACxC,CACJ;IACD+D,YAAY,EAAElB,yBAA0B;IACxCmB,kBAAkB,eACdhG,KAAA,CAAA8E,aAAA,CAAC5D,0BAA0B;MAAC,eAAa;IAA2B,CAAE;EACzE,GAEA,CAAC;IAAE6B;EAAuB,CAAC,kBACxB/C,KAAA,CAAA8E,aAAA,CAACjE,UAAU;IAAC,eAAY;EAAmB,GACtCkC,IAAI,CAACqC,GAAG,CAACb,IAAI,iBACVvE,KAAA,CAAA8E,aAAA,CAAChE,QAAQ;IAACsD,GAAG,EAAEG,IAAI,CAACd,EAAG;IAACwC,QAAQ,EAAE1B,IAAI,CAACd,EAAE,KAAKA;EAAG,gBAC7CzD,KAAA,CAAA8E,aAAA,CAAC/D,YAAY;IACT8E,OAAO,EAAEA,CAAA,KACLnD,OAAO,CAACkC,IAAI,CAAC,+BAA+BL,IAAI,CAACd,EAAE,EAAE;EACxD,gBAEDzD,KAAA,CAAA8E,aAAA,CAAC1D,mBAAmB,QAAEmD,IAAI,CAACT,IAA0B,CAAC,eACtD9D,KAAA,CAAA8E,aAAA,CAAC9D,qBAAqB,QAAEuD,IAAI,CAACP,WAAmC,CACtD,CAAC,eAEfhE,KAAA,CAAA8E,aAAA,CAAC7D,YAAY,qBACTjB,KAAA,CAAA8E,aAAA,CAACzD,WAAW,QACPkD,IAAI,CAAC2B,MAAM,IAAI3B,IAAI,CAAC4B,MAAM,gBACvBnG,KAAA,CAAA8E,aAAA,CAACtE,OAAO;IACJ4F,OAAO,eACHpG,KAAA,CAAA8E,aAAA,eACKP,IAAI,CAAC2B,MAAM,GACNlE,CAAC,6BAA6B,GAC9BA,CAAC,6CACL,CACT;IACDqE,OAAO,eAAErG,KAAA,CAAA8E,aAAA,CAACxD,UAAU;MAACgF,QAAQ;IAAA,CAAE;EAAE,CACpC,CAAC,gBAEFtG,KAAA,CAAA8E,aAAA,CAACxD,UAAU;IACPuE,OAAO,EAAEA,CAAA,KAAMvB,UAAU,CAACC,IAAI,CAAE;IAChC,eAAa;EAA2B,CAC3C,CAEI,CACH,CACR,CACb,CACO,CAEV,CAAC;AAEnB,CAAC","ignoreList":[]}

package/ui/views/Teams/TeamsForm.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+export interface TeamsFormProps {
+    [key: string]: any;
+}
+export declare const TeamsForm: () => React.JSX.Element;

package/ui/views/Teams/TeamsForm.js

@@ -0,0 +1,173 @@
+import React, { useCallback } from "react";
+import { useMutation, useQuery } from "@apollo/react-hooks";
+import pick from "lodash/pick";
+import get from "lodash/get";
+import { useRouter } from "@webiny/react-router";
+import { i18n } from "@webiny/app/i18n";
+import { Form } from "@webiny/form";
+import { validation } from "@webiny/validation";
+import { SimpleForm, SimpleFormFooter, SimpleFormContent, SimpleFormHeader } from "@webiny/app-admin/components/SimpleForm";
+import { useSnackbar } from "@webiny/app-admin/hooks/useSnackbar";
+import { CREATE_TEAM, LIST_TEAMS, READ_TEAM, UPDATE_TEAM } from "./graphql";
+import isEmpty from "lodash/isEmpty";
+import EmptyView from "@webiny/app-admin/components/EmptyView";
+import { ReactComponent as AddIcon } from "@webiny/app-admin/assets/icons/add-18px.svg";
+import { GroupsMultiAutocomplete } from "../../../components/GroupsMultiAutocomplete";
+import { ReactComponent as SettingsIcon } from "@webiny/icons/settings.svg";
+import { Alert, Button, Grid, Input, OverlayLoader, Textarea } from "@webiny/admin-ui";
+const t = i18n.ns("app-security/admin/teams/form");
+export const TeamsForm = () => {
+  const {
+    location,
+    history
+  } = useRouter();
+  const {
+    showSnackbar
+  } = useSnackbar();
+  const newTeam = new URLSearchParams(location.search).get("new") === "true";
+  const id = new URLSearchParams(location.search).get("id");
+  const getQuery = useQuery(READ_TEAM, {
+    variables: {
+      id
+    },
+    skip: !id,
+    onCompleted: data => {
+      if (!data) {
+        return;
+      }
+      const {
+        error
+      } = data.security.team;
+      if (error) {
+        history.push("/access-management/teams");
+        showSnackbar(error.message);
+      }
+    }
+  });
+  const [create, createMutation] = useMutation(CREATE_TEAM, {
+    refetchQueries: [{
+      query: LIST_TEAMS
+    }]
+  });
+  const [update, updateMutation] = useMutation(UPDATE_TEAM, {
+    refetchQueries: [{
+      query: LIST_TEAMS
+    }]
+  });
+  const loading = [getQuery, createMutation, updateMutation].find(item => item.loading);
+  const onSubmit = useCallback(async formData => {
+    const isUpdate = formData.createdOn;
+    const [operation, args] = isUpdate ? [update, {
+      variables: {
+        id: formData.id,
+        data: pick(formData, ["name", "description", "groups"])
+      }
+    }] : [create, {
+      variables: {
+        data: pick(formData, ["name", "slug", "description", "groups"])
+      }
+    }];
+    const response = await operation(args);
+    const {
+      data: team,
+      error
+    } = response.data.security.team;
+    if (error) {
+      return showSnackbar(error.message);
+    }
+    !isUpdate && history.push(`/access-management/teams?id=${team.id}`);
+    showSnackbar(t`Team saved successfully!`);
+  }, [id]);
+  const data = loading ? {} : get(getQuery, "data.security.team.data", {});
+  const systemTeam = data.system;
+  const pluginTeam = data.plugin;
+  const canModifyTeam = !systemTeam && !pluginTeam;
+  const showEmptyView = !newTeam && !loading && isEmpty(data);
+  // Render "No content" selected view.
+  if (showEmptyView) {
+    return /*#__PURE__*/React.createElement(EmptyView, {
+      icon: /*#__PURE__*/React.createElement(SettingsIcon, null),
+      title: t`Click on the left side list to display team details or create a...`,
+      action: /*#__PURE__*/React.createElement(Button, {
+        text: t`New Team`,
+        icon: /*#__PURE__*/React.createElement(AddIcon, null),
+        "data-testid": "new-record-button",
+        onClick: () => history.push("/access-management/teams?new=true")
+      })
+    });
+  }
+  return /*#__PURE__*/React.createElement(Form, {
+    data: data,
+    onSubmit: onSubmit
+  }, ({
+    data,
+    form,
+    Bind
+  }) => {
+    return /*#__PURE__*/React.createElement(SimpleForm, null, loading && /*#__PURE__*/React.createElement(OverlayLoader, null), /*#__PURE__*/React.createElement(SimpleFormHeader, {
+      title: data.name ? data.name : "Untitled"
+    }), /*#__PURE__*/React.createElement(SimpleFormContent, null, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(React.Fragment, null, systemTeam && /*#__PURE__*/React.createElement(Grid.Column, {
+      span: 12
+    }, /*#__PURE__*/React.createElement(Alert, {
+      type: "info",
+      title: "Permissions are locked"
+    }, "This is a protected system team and you can't modify its permissions.")), pluginTeam && /*#__PURE__*/React.createElement(Grid.Column, {
+      span: 12
+    }, /*#__PURE__*/React.createElement(Alert, {
+      type: "info",
+      title: "Important"
+    }, "This team is registered via an extension, and cannot be modified."))), /*#__PURE__*/React.createElement(Grid.Column, {
+      span: 6
+    }, /*#__PURE__*/React.createElement(Bind, {
+      name: "name",
+      validators: validation.create("required,minLength:3")
+    }, /*#__PURE__*/React.createElement(Input, {
+      size: "lg",
+      disabled: !canModifyTeam,
+      label: t`Name`,
+      "data-testid": "admin.am.team.new.name"
+    }))), /*#__PURE__*/React.createElement(Grid.Column, {
+      span: 6
+    }, /*#__PURE__*/React.createElement(Bind, {
+      name: "slug",
+      validators: validation.create("required,minLength:3")
+    }, /*#__PURE__*/React.createElement(Input, {
+      size: "lg",
+      disabled: !canModifyTeam || !newTeam,
+      label: t`Slug`,
+      "data-testid": "admin.am.team.new.slug"
+    }))), /*#__PURE__*/React.createElement(Grid.Column, {
+      span: 12
+    }, /*#__PURE__*/React.createElement(Bind, {
+      name: "description",
+      validators: validation.create("maxLength:500")
+    }, /*#__PURE__*/React.createElement(Textarea, {
+      size: "lg",
+      disabled: !canModifyTeam,
+      label: t`Description`,
+      rows: 3,
+      "data-testid": "admin.am.team.new.description"
+    }))), /*#__PURE__*/React.createElement(Grid.Column, {
+      span: 12
+    }, /*#__PURE__*/React.createElement(Bind, {
+      name: "groups",
+      validators: validation.create("required")
+    }, /*#__PURE__*/React.createElement(GroupsMultiAutocomplete, {
+      disabled: !canModifyTeam,
+      label: t`Roles`,
+      "data-testid": "admin.am.team.new.groups"
+    }))))), /*#__PURE__*/React.createElement(SimpleFormFooter, null, /*#__PURE__*/React.createElement(Button, {
+      variant: "secondary",
+      text: t`Cancel`,
+      onClick: () => history.push("/access-management/teams")
+    }), canModifyTeam && /*#__PURE__*/React.createElement(Button, {
+      text: t`Save`,
+      "data-testid": "admin.am.team.new.save",
+      onClick: ev => {
+        form.submit(ev);
+      }
+    })));
+  });
+};
+
+//# sourceMappingURL=TeamsForm.js.map

package/ui/views/Teams/TeamsForm.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","useMutation","useQuery","pick","get","useRouter","i18n","Form","validation","SimpleForm","SimpleFormFooter","SimpleFormContent","SimpleFormHeader","useSnackbar","CREATE_TEAM","LIST_TEAMS","READ_TEAM","UPDATE_TEAM","isEmpty","EmptyView","ReactComponent","AddIcon","GroupsMultiAutocomplete","SettingsIcon","Alert","Button","Grid","Input","OverlayLoader","Textarea","t","ns","TeamsForm","location","history","showSnackbar","newTeam","URLSearchParams","search","id","getQuery","variables","skip","onCompleted","data","error","security","team","push","message","create","createMutation","refetchQueries","query","update","updateMutation","loading","find","item","onSubmit","formData","isUpdate","createdOn","operation","args","response","systemTeam","system","pluginTeam","plugin","canModifyTeam","showEmptyView","createElement","icon","title","action","text","onClick","form","Bind","name","Fragment","Column","span","type","validators","size","disabled","label","rows","variant","ev","submit"],"sources":["TeamsForm.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport { useMutation, useQuery } from \"@apollo/react-hooks\";\nimport pick from \"lodash/pick\";\nimport get from \"lodash/get\";\nimport { useRouter } from \"@webiny/react-router\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Form } from \"@webiny/form\";\nimport { validation } from \"@webiny/validation\";\nimport {\n    SimpleForm,\n    SimpleFormFooter,\n    SimpleFormContent,\n    SimpleFormHeader\n} from \"@webiny/app-admin/components/SimpleForm\";\nimport { useSnackbar } from \"@webiny/app-admin/hooks/useSnackbar\";\nimport { CREATE_TEAM, LIST_TEAMS, READ_TEAM, UPDATE_TEAM } from \"./graphql\";\nimport isEmpty from \"lodash/isEmpty\";\nimport EmptyView from \"@webiny/app-admin/components/EmptyView\";\nimport { ReactComponent as AddIcon } from \"@webiny/app-admin/assets/icons/add-18px.svg\";\nimport { GroupsMultiAutocomplete } from \"~/components/GroupsMultiAutocomplete\";\nimport type { Team } from \"~/types\";\nimport { ReactComponent as SettingsIcon } from \"@webiny/icons/settings.svg\";\nimport { Alert, Button, Grid, Input, OverlayLoader, Textarea } from \"@webiny/admin-ui\";\n\nconst t = i18n.ns(\"app-security/admin/teams/form\");\n\nexport interface TeamsFormProps {\n    // TODO @ts-refactor delete and go up the tree and sort it out\n    [key: string]: any;\n}\n\nexport const TeamsForm = () => {\n    const { location, history } = useRouter();\n    const { showSnackbar } = useSnackbar();\n    const newTeam = new URLSearchParams(location.search).get(\"new\") === \"true\";\n    const id = new URLSearchParams(location.search).get(\"id\");\n\n    const getQuery = useQuery(READ_TEAM, {\n        variables: { id },\n        skip: !id,\n        onCompleted: data => {\n            if (!data) {\n                return;\n            }\n\n            const { error } = data.security.team;\n            if (error) {\n                history.push(\"/access-management/teams\");\n                showSnackbar(error.message);\n            }\n        }\n    });\n\n    const [create, createMutation] = useMutation(CREATE_TEAM, {\n        refetchQueries: [{ query: LIST_TEAMS }]\n    });\n\n    const [update, updateMutation] = useMutation(UPDATE_TEAM, {\n        refetchQueries: [{ query: LIST_TEAMS }]\n    });\n\n    const loading = [getQuery, createMutation, updateMutation].find(item => item.loading);\n\n    const onSubmit = useCallback(\n        async (formData: Team) => {\n            const isUpdate = formData.createdOn;\n            const [operation, args] = isUpdate\n                ? [\n                      update,\n                      {\n                          variables: {\n                              id: formData.id,\n                              data: pick(formData, [\"name\", \"description\", \"groups\"])\n                          }\n                      }\n                  ]\n                : [\n                      create,\n                      {\n                          variables: {\n                              data: pick(formData, [\"name\", \"slug\", \"description\", \"groups\"])\n                          }\n                      }\n                  ];\n\n            const response = await operation(args);\n\n            const { data: team, error } = response.data.security.team;\n            if (error) {\n                return showSnackbar(error.message);\n            }\n\n            !isUpdate && history.push(`/access-management/teams?id=${team.id}`);\n            showSnackbar(t`Team saved successfully!`);\n        },\n        [id]\n    );\n\n    const data = loading ? {} : get(getQuery, \"data.security.team.data\", {});\n\n    const systemTeam = data.system;\n    const pluginTeam = data.plugin;\n    const canModifyTeam = !systemTeam && !pluginTeam;\n\n    const showEmptyView = !newTeam && !loading && isEmpty(data);\n    // Render \"No content\" selected view.\n    if (showEmptyView) {\n        return (\n            <EmptyView\n                icon={<SettingsIcon />}\n                title={t`Click on the left side list to display team details or create a...`}\n                action={\n                    <Button\n                        text={t`New Team`}\n                        icon={<AddIcon />}\n                        data-testid=\"new-record-button\"\n                        onClick={() => history.push(\"/access-management/teams?new=true\")}\n                    />\n                }\n            />\n        );\n    }\n\n    return (\n        <Form data={data} onSubmit={onSubmit}>\n            {({ data, form, Bind }) => {\n                return (\n                    <SimpleForm>\n                        {loading && <OverlayLoader />}\n                        <SimpleFormHeader title={data.name ? data.name : \"Untitled\"} />\n                        <SimpleFormContent>\n                            <Grid>\n                                <>\n                                    {systemTeam && (\n                                        <Grid.Column span={12}>\n                                            <Alert type={\"info\"} title={\"Permissions are locked\"}>\n                                                This is a protected system team and you can&apos;t\n                                                modify its permissions.\n                                            </Alert>\n                                        </Grid.Column>\n                                    )}\n                                    {pluginTeam && (\n                                        <Grid.Column span={12}>\n                                            <Alert type={\"info\"} title={\"Important\"}>\n                                                This team is registered via an extension, and cannot\n                                                be modified.\n                                            </Alert>\n                                        </Grid.Column>\n                                    )}\n                                </>\n                                <Grid.Column span={6}>\n                                    <Bind\n                                        name=\"name\"\n                                        validators={validation.create(\"required,minLength:3\")}\n                                    >\n                                        <Input\n                                            size={\"lg\"}\n                                            disabled={!canModifyTeam}\n                                            label={t`Name`}\n                                            data-testid=\"admin.am.team.new.name\"\n                                        />\n                                    </Bind>\n                                </Grid.Column>\n                                <Grid.Column span={6}>\n                                    <Bind\n                                        name=\"slug\"\n                                        validators={validation.create(\"required,minLength:3\")}\n                                    >\n                                        <Input\n                                            size={\"lg\"}\n                                            disabled={!canModifyTeam || !newTeam}\n                                            label={t`Slug`}\n                                            data-testid=\"admin.am.team.new.slug\"\n                                        />\n                                    </Bind>\n                                </Grid.Column>\n                                <Grid.Column span={12}>\n                                    <Bind\n                                        name=\"description\"\n                                        validators={validation.create(\"maxLength:500\")}\n                                    >\n                                        <Textarea\n                                            size={\"lg\"}\n                                            disabled={!canModifyTeam}\n                                            label={t`Description`}\n                                            rows={3}\n                                            data-testid=\"admin.am.team.new.description\"\n                                        />\n                                    </Bind>\n                                </Grid.Column>\n                                <Grid.Column span={12}>\n                                    <Bind name=\"groups\" validators={validation.create(\"required\")}>\n                                        <GroupsMultiAutocomplete\n                                            disabled={!canModifyTeam}\n                                            label={t`Roles`}\n                                            data-testid=\"admin.am.team.new.groups\"\n                                        />\n                                    </Bind>\n                                </Grid.Column>\n                            </Grid>\n                        </SimpleFormContent>\n                        <SimpleFormFooter>\n                            <Button\n                                variant={\"secondary\"}\n                                text={t`Cancel`}\n                                onClick={() => history.push(\"/access-management/teams\")}\n                            />\n                            {canModifyTeam && (\n                                <Button\n                                    text={t`Save`}\n                                    data-testid=\"admin.am.team.new.save\"\n                                    onClick={ev => {\n                                        form.submit(ev);\n                                    }}\n                                />\n                            )}\n                        </SimpleFormFooter>\n                    </SimpleForm>\n                );\n            }}\n        </Form>\n    );\n};\n"],"mappings":"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","ignoreList":[]}

package/ui/views/Teams/graphql.d.ts

@@ -0,0 +1,13 @@
+import type { Team } from "../../../types";
+export interface ListTeamsResponse {
+    security: {
+        teams: {
+            data: Team[];
+        };
+    };
+}
+export declare const LIST_TEAMS: import("graphql").DocumentNode;
+export declare const READ_TEAM: import("graphql").DocumentNode;
+export declare const CREATE_TEAM: import("graphql").DocumentNode;
+export declare const UPDATE_TEAM: import("graphql").DocumentNode;
+export declare const DELETE_TEAM: import("graphql").DocumentNode;

package/ui/views/Teams/graphql.js

@@ -0,0 +1,89 @@
+import gql from "graphql-tag";
+const fields = `
+    id
+    name
+    slug
+    description
+    groups {
+        id
+        slug
+        name
+    }
+    system
+    plugin
+    createdOn
+`;
+export const LIST_TEAMS = gql`
+    query listTeams {
+        security {
+            teams: listTeams {
+                data {
+                    ${fields}
+                }
+            }
+        }
+    }
+`;
+export const READ_TEAM = gql`
+    query getTeam($id: ID!) {
+        security {
+            team: getTeam(where: { id: $id }){
+                data {
+                    ${fields}
+                }
+                error {
+                    code
+                    message
+                }
+            }
+        }
+    }
+`;
+export const CREATE_TEAM = gql`
+    mutation createTeam($data: SecurityTeamCreateInput!){
+        security {
+            team: createTeam(data: $data) {
+                data {
+                    ${fields}
+                }
+                error {
+                    code
+                    message
+                    data
+                }
+            }
+        }
+    }
+`;
+export const UPDATE_TEAM = gql`
+    mutation updateTeam($id: ID!, $data: SecurityTeamUpdateInput!){
+        security {
+            team: updateTeam(id: $id, data: $data) {
+                data {
+                    ${fields}
+                }
+                error {
+                    code
+                    message
+                    data
+                }
+            }
+        }
+    }
+`;
+export const DELETE_TEAM = gql`
+    mutation deleteTeam($id: ID!) {
+        security {
+            deleteTeam(id: $id) {
+                data
+                error {
+                    code
+                    message
+                    data
+                }
+            }
+        }
+    }
+`;
+
+//# sourceMappingURL=graphql.js.map

package/ui/views/Teams/graphql.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["gql","fields","LIST_TEAMS","READ_TEAM","CREATE_TEAM","UPDATE_TEAM","DELETE_TEAM"],"sources":["graphql.ts"],"sourcesContent":["import gql from \"graphql-tag\";\nimport type { Team } from \"~/types\";\n\nconst fields = `\n    id\n    name\n    slug\n    description\n    groups {\n        id\n        slug\n        name\n    }\n    system\n    plugin\n    createdOn\n`;\n\nexport interface ListTeamsResponse {\n    security: {\n        teams: {\n            data: Team[];\n        };\n    };\n}\n\nexport const LIST_TEAMS = gql`\n    query listTeams {\n        security {\n            teams: listTeams {\n                data {\n                    ${fields}\n                }\n            }\n        }\n    }\n`;\n\nexport const READ_TEAM = gql`\n    query getTeam($id: ID!) {\n        security {\n            team: getTeam(where: { id: $id }){\n                data {\n                    ${fields}\n                }\n                error {\n                    code\n                    message\n                }\n            }\n        }\n    }\n`;\n\nexport const CREATE_TEAM = gql`\n    mutation createTeam($data: SecurityTeamCreateInput!){\n        security {\n            team: createTeam(data: $data) {\n                data {\n                    ${fields}\n                }\n                error {\n                    code\n                    message\n                    data\n                }\n            }\n        }\n    }\n`;\n\nexport const UPDATE_TEAM = gql`\n    mutation updateTeam($id: ID!, $data: SecurityTeamUpdateInput!){\n        security {\n            team: updateTeam(id: $id, data: $data) {\n                data {\n                    ${fields}\n                }\n                error {\n                    code\n                    message\n                    data\n                }\n            }\n        }\n    }\n`;\n\nexport const DELETE_TEAM = gql`\n    mutation deleteTeam($id: ID!) {\n        security {\n            deleteTeam(id: $id) {\n                data\n                error {\n                    code\n                    message\n                    data\n                }\n            }\n        }\n    }\n`;\n"],"mappings":"AAAA,OAAOA,GAAG,MAAM,aAAa;AAG7B,MAAMC,MAAM,GAAG;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAUD,OAAO,MAAMC,UAAU,GAAGF,GAAG;AAC7B;AACA;AACA;AACA;AACA,sBAAsBC,MAAM;AAC5B;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAME,SAAS,GAAGH,GAAG;AAC5B;AACA;AACA;AACA;AACA,sBAAsBC,MAAM;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMG,WAAW,GAAGJ,GAAG;AAC9B;AACA;AACA;AACA;AACA,sBAAsBC,MAAM;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMI,WAAW,GAAGL,GAAG;AAC9B;AACA;AACA;AACA;AACA,sBAAsBC,MAAM;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMK,WAAW,GAAGN,GAAG;AAC9B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/ui/views/Teams/index.d.ts

@@ -0,0 +1 @@
+export * from "./Teams";

package/ui/views/Teams/index.js

@@ -0,0 +1,3 @@
+export * from "./Teams";
+
+//# sourceMappingURL=index.js.map

package/ui/views/Teams/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Teams\";\n"],"mappings":"AAAA","ignoreList":[]}

package/ui/views/utils.d.ts

@@ -1,2 +1,3 @@
-export declare const serializeSorters: (data: any) => any;
-export declare const deserializeSorters: (data: string) => Record<string, "asc" | "desc" | boolean>;
+type SortTypes = "asc" | "desc";
+export declare const deserializeSorters: (data: string) => [string, SortTypes];
+export {};

package/ui/views/utils.js

@@ -1,27 +1,10 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-export var serializeSorters = function serializeSorters(data) {
-  if (!data) {
-    return data;
-  }
-
-  var _Object$entries = Object.entries(data),
-      _Object$entries2 = _slicedToArray(_Object$entries, 1),
-      _Object$entries2$ = _slicedToArray(_Object$entries2[0], 2),
-      key = _Object$entries2$[0],
-      value = _Object$entries2$[1];
-
-  return "".concat(key, ":").concat(value);
-};
-export var deserializeSorters = function deserializeSorters(data) {
+export const deserializeSorters = data => {
   if (typeof data !== "string") {
     return data;
   }
+  const [field, orderBy] = data.split("_");
+  const order = String(orderBy).toLowerCase() === "asc" ? "asc" : "desc";
+  return [field, order];
+};
 
-  var _ref = data.split(":"),
-      _ref2 = _slicedToArray(_ref, 2),
-      key = _ref2[0],
-      value = _ref2[1];
-
-  return _defineProperty({}, key, value);
-};
+//# sourceMappingURL=utils.js.map

package/ui/views/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["deserializeSorters","data","field","orderBy","split","order","String","toLowerCase"],"sources":["utils.ts"],"sourcesContent":["type SortTypes = \"asc\" | \"desc\";\nexport const deserializeSorters = (data: string): [string, SortTypes] => {\n    if (typeof data !== \"string\") {\n        return data;\n    }\n    const [field, orderBy] = data.split(\"_\") as [string, SortTypes];\n    const order = String(orderBy).toLowerCase() === \"asc\" ? \"asc\" : \"desc\";\n    return [field, order];\n};\n"],"mappings":"AACA,OAAO,MAAMA,kBAAkB,GAAIC,IAAY,IAA0B;EACrE,IAAI,OAAOA,IAAI,KAAK,QAAQ,EAAE;IAC1B,OAAOA,IAAI;EACf;EACA,MAAM,CAACC,KAAK,EAAEC,OAAO,CAAC,GAAGF,IAAI,CAACG,KAAK,CAAC,GAAG,CAAwB;EAC/D,MAAMC,KAAK,GAAGC,MAAM,CAACH,OAAO,CAAC,CAACI,WAAW,CAAC,CAAC,KAAK,KAAK,GAAG,KAAK,GAAG,MAAM;EACtE,OAAO,CAACL,KAAK,EAAEG,KAAK,CAAC;AACzB,CAAC","ignoreList":[]}

package/plugins/menus.d.ts

@@ -1,4 +0,0 @@
-import { UIViewPlugin } from "@webiny/app-admin/ui/UIView";
-import { NavigationView } from "@webiny/app-admin/ui/views/NavigationView";
-declare const _default: UIViewPlugin<NavigationView>;
-export default _default;

package/plugins/menus.js

@@ -1,61 +0,0 @@
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-import { NavigationMenuElement, TAGS } from "@webiny/app-admin/ui/elements/NavigationMenuElement";
-import { Permission } from "./constants";
-import { UIViewPlugin } from "@webiny/app-admin/ui/UIView";
-import { NavigationView } from "@webiny/app-admin/ui/views/NavigationView";
-export default new UIViewPlugin(NavigationView, /*#__PURE__*/function () {
-  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(view) {
-    var _view$getSecurityHook, identity, groups, apiKeys, mainMenu;
-
-    return _regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            _context.next = 2;
-            return view.isRendered();
-
-          case 2:
-            _view$getSecurityHook = view.getSecurityHook(), identity = _view$getSecurityHook.identity;
-            groups = identity.getPermission(Permission.Groups);
-            apiKeys = identity.getPermission(Permission.ApiKeys);
-
-            if (!(!groups && !apiKeys)) {
-              _context.next = 7;
-              break;
-            }
-
-            return _context.abrupt("return");
-
-          case 7:
-            mainMenu = view.getSettingsMenuElement().addElement(new NavigationMenuElement("accessManagement", {
-              label: "Access Management",
-              tags: [TAGS.UTILS]
-            }));
-
-            if (groups) {
-              mainMenu.addElement(new NavigationMenuElement("groups", {
-                label: "Groups",
-                path: "/access-management/groups"
-              }));
-            }
-
-            if (apiKeys) {
-              mainMenu.addElement(new NavigationMenuElement("apiKeys", {
-                label: "API Keys",
-                path: "/access-management/api-keys"
-              }));
-            }
-
-          case 10:
-          case "end":
-            return _context.stop();
-        }
-      }
-    }, _callee);
-  }));
-
-  return function (_x) {
-    return _ref.apply(this, arguments);
-  };
-}());