@fishawack/lab-velocity 2.0.0-beta.4 → 2.0.0-beta.41

package/_Build/vue/modules/AuthModule/js/router.js

@@ -3,8 +3,20 @@
 import { h } from "vue";
 import { RouterView } from "vue-router";
 
+import { routes as resourceRoutes } from "../../resource/index.js";
+
+import defaultUserResource from "../routes/PUsers/resource.js";
+import defaultCompanyResource from "../routes/PCompanies/resource.js";
+import defaultTeamResource from "../routes/PTeams/resource.js";
+
 // Admin routes export - minimal auth flow (headless login only)
-export function adminRoutes(node) {
+export function adminRoutes(node, overrides = {}) {
+    const {
+        userResource = defaultUserResource,
+        companyResource = defaultCompanyResource,
+        teamResource = defaultTeamResource,
+    } = overrides;
+
     return [
         {
             path: "/auth",
@@ -39,94 +51,17 @@ export function adminRoutes(node) {
                 },
             ],
         },
-        {
-            path: "/users",
-            component: node
-                ? ""
-                : require("../adminRoutes/PUsers/parent.vue").default,
-            children: [
-                {
-                    path: "",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PUsers/Children/index.vue")
-                              .default,
-                    name: "users.index",
-                },
-                {
-                    path: "create",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PUsers/Children/create.vue")
-                              .default,
-                    name: "users.create",
-                },
-                {
-                    path: ":id",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PUsers/Children/show.vue")
-                              .default,
-                    name: "users.show",
-                },
-                {
-                    path: ":id/edit",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PUsers/Children/edit.vue")
-                              .default,
-                    name: "users.edit",
-                },
-            ],
-        },
-        {
-            path: "/companies",
-            component: node
-                ? ""
-                : require("../adminRoutes/PCompanies/parent.vue").default,
-            children: [
-                {
-                    path: "",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PCompanies/Children/index.vue")
-                              .default,
-                    name: "companies.index",
-                },
-                {
-                    path: "create",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PCompanies/Children/create.vue")
-                              .default,
-                    name: "companies.create",
-                },
-                {
-                    path: ":id",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PCompanies/Children/show.vue")
-                              .default,
-                    name: "companies.show",
-                },
-                {
-                    path: ":id/edit",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PCompanies/Children/edit.vue")
-                              .default,
-                    name: "companies.edit",
-                },
-                {
-                    path: ":id/upload",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PCompanies/Children/Upload/upload.vue")
-                              .default,
-                    name: "companies.upload",
-                },
-            ],
-        },
+        ...resourceRoutes(node, ...userResource),
+        ...resourceRoutes(node, ...companyResource, [
+            ...resourceRoutes(node, teamResource[0], {
+                ...teamResource[1],
+                routeName: "companies.teams",
+            }),
+        ]),
+        ...resourceRoutes(node, teamResource[0], {
+            ...teamResource[1],
+            routeName: "teams",
+        }),
     ];
 }
 

package/_Build/vue/modules/AuthModule/js/store.js

@@ -7,6 +7,9 @@ const store = {
             intended: null,
             user: null,
             redirect: process.env.HYDRATE_REDIRECT ?? "index",
+            logo: process.env.HYDRATE_LOGO ?? "example-logo",
+            logoReverse:
+                process.env.HYDRATE_LOGO_REVERSE ?? process.env.HYDRATE_LOGO,
             contact:
                 process.env.HYDRATE_CONTACT ?? "mailto:det@avalerehealth.com",
         };
@@ -15,12 +18,18 @@ const store = {
     getters: {
         authenticated: (state) => !!state.user,
         can: (state) => (permission) => {
-            return state.user?.permissions
-                .map(({ name }) => name)
-                .includes(permission);
+            const arr = Array.isArray(permission) ? permission : [permission];
+            const userPermissions = state.user?.permissions.map(
+                ({ name }) => name,
+            );
+
+            return arr.every((name) => userPermissions?.includes(name));
         },
         hasRole: (state) => (role) => {
-            return state.user?.roles.map(({ name }) => name).includes(role);
+            const arr = Array.isArray(role) ? role : [role];
+            const userRoles = state.user?.roles.map(({ name }) => name);
+
+            return arr.every((name) => userRoles?.includes(name));
         },
     },
 
@@ -38,7 +47,7 @@ const store = {
     },
 
     actions: {
-        getUser({ commit }, { errors, query = "", params }) {
+        getUser({ commit }, { errors = console.log, query = "", params } = {}) {
             return axios
                 .get(`/api/users/self${query}`, {
                     params,
@@ -51,7 +60,7 @@ const store = {
                 .catch(errors);
         },
 
-        logout({ commit }, { errors }) {
+        logout({ commit }) {
             commit("setUser", null);
 
             return axios.post("/logout");

package/_Build/vue/modules/AuthModule/routes/PCompanies/columns.js

@@ -0,0 +1,268 @@
+import { h, resolveComponent } from "vue";
+import { ElInput } from "element-plus";
+
+import VelBasic from "../../../../components/form/basic.vue";
+import VelButton from "../../../../components/basic/Button.vue";
+import VelSelect from "../../../../components/form/Select.vue";
+import VelFormRole from "../../../../components/layout/FormRole.vue";
+import Chip from "../../../../components/layout/Chip.vue";
+import Chips from "../../../../components/layout/Chips.vue";
+
+export default [
+    {
+        key: "name",
+        sortable: true,
+    },
+    {
+        key: "primary_contact",
+        label: "Primary Contact",
+        condition: {
+            table: false,
+            form: {
+                write: ({ method }) => method === "patch",
+            },
+        },
+        preparation: ({ form }) => form.primary_contact?.id,
+        render: {
+            read: ({ model }) => h("span", model.primary_contact?.name),
+            write: ({ $route }) =>
+                h(VelSelect, {
+                    endpoint: `api/users`,
+                    params: {
+                        "filter[company_id]": $route.params.companiesId,
+                    },
+                    labelKey: "name",
+                    filterable: true,
+                    searchParam: "name",
+                }),
+        },
+    },
+    {
+        key: "primary_contact_email",
+        label: "Primary Contact Email",
+        condition: {
+            table: false,
+            form: false,
+        },
+        render: {
+            read: ({ model }) => h("span", model.primary_contact?.email),
+        },
+    },
+    {
+        key: "primary_contact_contacted",
+        label: "Primary Contact Contacted",
+        condition: {
+            table: false,
+            form: false,
+        },
+        render: {
+            read: ({ model }) =>
+                h("span", String(!!model.primary_contact_contacted)),
+        },
+    },
+    {
+        key: "domains",
+        condition: {
+            table: false,
+        },
+        initial: ({ model }) => model?.domains || [],
+        render: {
+            read: ({ model }) => h("span", model.domains.join(", ")),
+            write: ({ form }) =>
+                h("div", { class: "form__group vel-basic" }, [
+                    h("p", { class: "my-0" }, [
+                        "Domain/s ",
+                        h("sup", { class: "color-status-red-100" }, "*"),
+                    ]),
+                    h(
+                        "ul",
+                        { class: "list-none pl-0 mt mb-2" },
+                        form.domains.map((domain, index) =>
+                            h("li", { key: index, class: "mb-0.5" }, [
+                                h(
+                                    ElInput,
+                                    {
+                                        modelValue: form.domains[index],
+                                        "onUpdate:modelValue": (val) => {
+                                            form.domains[index] = val;
+                                        },
+                                        placeholder: "avalerehealth.com",
+                                    },
+                                    {
+                                        prepend: () => "@",
+                                        append: () =>
+                                            h(
+                                                VelButton,
+                                                {
+                                                    type: "danger",
+                                                    onClick: () =>
+                                                        form.domains.splice(
+                                                            index,
+                                                            1,
+                                                        ),
+                                                },
+                                                () =>
+                                                    h(
+                                                        resolveComponent(
+                                                            "GSvg",
+                                                        ),
+                                                        {
+                                                            class: "vel-icon",
+                                                            name: "icon-trash",
+                                                        },
+                                                    ),
+                                            ),
+                                    },
+                                ),
+                                form.errors?.has?.(`domains.${index}`) &&
+                                    h(
+                                        "small",
+                                        {
+                                            class: "form__error vel-basic__error",
+                                        },
+                                        form.errors.first(`domains.${index}`),
+                                    ),
+                            ]),
+                        ),
+                    ),
+                    h("div", [
+                        h(
+                            VelButton,
+                            {
+                                onClick: () => form.domains.push(""),
+                            },
+                            () => [
+                                "Add Domain ",
+                                h(resolveComponent("GIcon"), {
+                                    name: "icon-plus",
+                                    embed: true,
+                                    asis: true,
+                                    class: "fill-0 icon--0.5 ml",
+                                }),
+                            ],
+                        ),
+                    ]),
+                ]),
+        },
+    },
+    {
+        key: "seats",
+        label: "Available Seats",
+        type: "number",
+        min: 0,
+        condition: {
+            table: false,
+        },
+    },
+    {
+        key: "user_count",
+        label: "Total Users",
+        width: "150",
+        condition: {
+            form: false,
+        },
+    },
+    {
+        key: "sso_enabled",
+        label: "SSO Enabled",
+        condition: {
+            table: false,
+            form: false,
+        },
+    },
+    {
+        key: "roles",
+        label: "Role",
+        condition: {
+            description: false,
+            form: {
+                write: ({ $store }) => $store.getters.can("edit roles"),
+            },
+        },
+        initial: ({ model }) =>
+            model?.roles.map((val) => ({
+                label: val.label,
+                value: val.id,
+            })) || [],
+        preparation: ({ form }) =>
+            form.roles.map((d) => (typeof d === "object" ? d.value : d)),
+        render: {
+            read: ({ model }) =>
+                h(
+                    model.roles.length === 1 ? Chip : Chips,
+                    model.roles.length === 1
+                        ? {
+                              name: model.roles[0].name,
+                              label: model.roles[0].label,
+                          }
+                        : { array: model.roles },
+                ),
+            write: ({ model, form }) =>
+                h(VelFormRole, {
+                    overrides: model?.overrides_roles_and_permissions,
+                    form,
+                }),
+        },
+    },
+    {
+        key: "sso_type",
+        label: "Provider",
+        condition: {
+            table: false,
+            description: false,
+            form: {
+                write: ({ $store }) => $store.getters.can("edit sso"),
+            },
+        },
+        initial: ({ model }) => model?.sso_type || undefined,
+        preparation: ({ form }) => form.sso_type?.value,
+        render: {
+            write: () =>
+                h(VelSelect, {
+                    clearable: true,
+                    class: "mt-2",
+                    options: [
+                        { value: "azure", label: "azure" },
+                        { value: "google", label: "google" },
+                    ],
+                }),
+        },
+    },
+    {
+        key: "sso_client_id",
+        label: "Key",
+        condition: {
+            table: false,
+            description: false,
+            form: {
+                write: ({ $store }) => $store.getters.can("edit sso"),
+            },
+        },
+        initial: ({ model }) => model?.sso_client_id || undefined,
+    },
+    {
+        key: "sso_tenant",
+        label: "Tenant",
+        condition: {
+            table: false,
+            description: false,
+            form: {
+                write: ({ $store }) => $store.getters.can("edit sso"),
+            },
+        },
+        initial: ({ model }) => model?.sso_tenant || undefined,
+    },
+    {
+        key: "sso_client_secret",
+        label: "Secret",
+        type: "password",
+        condition: {
+            table: false,
+            description: false,
+            form: {
+                write: ({ $store }) => $store.getters.can("edit sso"),
+            },
+        },
+        initial: ({ model }) => model?.sso_client_secret || undefined,
+    },
+];

package/_Build/vue/modules/AuthModule/routes/PCompanies/resource.js

@@ -0,0 +1,213 @@
+import { merge } from "lodash";
+import { h, resolveComponent } from "vue";
+import axios from "axios";
+import { ElNotification } from "element-plus";
+
+import { columns, defaultResource, meta } from "../../../resource/index.js";
+import companiesColumns from "./columns.js";
+
+import VelFormRole from "../../../../components/layout/FormRole.vue";
+import VelButton from "../../../../components/basic/Button.vue";
+import VelTableSorter from "../../../../components/layout/TableSorter.vue";
+import VelRoleLegend from "../../../../components/layout/RoleLegend.vue";
+
+import userResource from "../PUsers/resource.js";
+import teamResource from "../PTeams/resource.js";
+
+export default [
+    "companies",
+    {
+        api: {
+            params: {
+                index: ({ $route }) => ({
+                    "filter[withTrashed]": $route.query.trashed,
+                }),
+                show: () => ({
+                    include: "primary_contact",
+                }),
+            },
+        },
+        permissions: {
+            create: ({ $store }) => $store.getters.can("write companies"),
+            edit: ({ $store }) => $store.getters.can("write companies"),
+            delete: ({ $store }) => $store.getters.can("delete companies"),
+        },
+        singular: "company",
+        icon: "icon-cases",
+        ...merge(columns(companiesColumns), {
+            index: {
+                layout: [
+                    ...defaultResource.index.layout,
+                    () =>
+                        h(VelRoleLegend, {
+                            class: "mt-5",
+                        }),
+                ],
+            },
+            show: {
+                actions: [
+                    ({ model }) =>
+                        model.primary_contact &&
+                        h(
+                            VelButton,
+                            {
+                                type: "primary",
+                                async onClick() {
+                                    try {
+                                        const res = await axios.post(
+                                            `/api/companies/${model.id}/welcome`,
+                                        );
+                                        ElNotification({
+                                            title: "Success",
+                                            message: res.data.message,
+                                            type: "success",
+                                        });
+
+                                        model.primary_contact_contacted = true;
+                                    } catch (e) {
+                                        ElNotification({
+                                            title: "Warning",
+                                            message:
+                                                e.response?.data?.message ||
+                                                e.message,
+                                            type: "warning",
+                                        });
+                                    }
+                                },
+                            },
+                            "Send welcome email",
+                        ),
+                    ...defaultResource.show.actions,
+                ],
+                tabs: [
+                    ...defaultResource.show.tabs,
+                    ({ model }) => ({
+                        label: "Access control",
+                        component: h(VelFormRole, {
+                            overrides: model.overrides_roles_and_permissions,
+                            form: { roles: model.roles.map((d) => d.id) },
+                            readonly: true,
+                        }),
+                    }),
+                    ({ model, $store, $router, $route, ...rest }) => {
+                        const resource = meta(...teamResource);
+
+                        const props = {
+                            model,
+                            $store,
+                            $router,
+                            $route,
+                            ...rest,
+                            resource,
+                        };
+
+                        return {
+                            label: "Teams",
+                            component: h("div", [
+                                h(
+                                    "div",
+                                    { class: "flex justify-end items-end" },
+                                    [
+                                        resource.permissions.create(props) &&
+                                            h(
+                                                VelButton,
+                                                {
+                                                    tag: "a",
+                                                    type: "primary",
+                                                    size: "large",
+                                                    onClick: () => {
+                                                        $router.push({
+                                                            name: `companies.${resource.routeName}.create`,
+                                                        });
+                                                    },
+                                                },
+                                                () => [
+                                                    h(
+                                                        resolveComponent(
+                                                            "GIcon",
+                                                        ),
+                                                        {
+                                                            class: "fill-0 mr-0.5 icon--0.5",
+                                                            name: "icon-plus",
+                                                            embed: true,
+                                                            artboard: true,
+                                                        },
+                                                    ),
+                                                    `Create ${resource.singular}`,
+                                                ],
+                                            ),
+                                    ],
+                                ),
+                                h(
+                                    VelTableSorter,
+                                    resource.index.structure(props),
+                                ),
+                            ]),
+                        };
+                    },
+                    ({ model, $store, $router, $route, ...rest }) => {
+                        const resource = meta(...userResource);
+
+                        resource.api.params.index = ({ $route }) => ({
+                            include: "company",
+                            "filter[company_id]": $route.params.companiesId,
+                        });
+
+                        const props = {
+                            model,
+                            $store,
+                            $router,
+                            $route,
+                            ...rest,
+                            resource,
+                        };
+
+                        return {
+                            label: "Users",
+                            component: h("div", [
+                                h(
+                                    "div",
+                                    { class: "flex justify-end items-end" },
+                                    [
+                                        resource.permissions.create(props) &&
+                                            h(
+                                                VelButton,
+                                                {
+                                                    tag: "a",
+                                                    type: "primary",
+                                                    size: "large",
+                                                    onClick: () => {
+                                                        $router.push({
+                                                            name: `${resource.slug}.create`,
+                                                        });
+                                                    },
+                                                },
+                                                () => [
+                                                    h(
+                                                        resolveComponent(
+                                                            "GIcon",
+                                                        ),
+                                                        {
+                                                            class: "fill-0 mr-0.5 icon--0.5",
+                                                            name: "icon-plus",
+                                                            embed: true,
+                                                            artboard: true,
+                                                        },
+                                                    ),
+                                                    `Create ${resource.singular}`,
+                                                ],
+                                            ),
+                                    ],
+                                ),
+                                h(
+                                    VelTableSorter,
+                                    resource.index.structure(props),
+                                ),
+                            ]),
+                        };
+                    },
+                ],
+            },
+        }),
+    },
+];