@jskit-ai/users-web 0.1.37 → 0.1.40

package/test/{useCrudSchemaForm.test.js → useCrudAddEdit.test.js}

@@ -11,7 +11,7 @@ import {
   applyCrudRouteBoundFieldValues,
   resolveCrudFieldErrors,
   parseCrudResourceOperationInput
-} from "../src/client/composables/crudSchemaFormHelpers.js";
+} from "../src/client/composables/crud/crudSchemaFormHelpers.js";
 
 test("normalizeCrudFormFields trims keys, removes invalid entries, and deduplicates", () => {
   const fields = normalizeCrudFormFields([
@@ -62,6 +62,86 @@ test("buildCrudFormPayload normalizes booleans and numbers while skipping empty
   });
 });
 
+test("buildCrudFormPayload and applyCrudPayloadToForm round-trip date-time fields", () => {
+  const fields = [
+    { key: "scheduledAt", type: "string", format: "date-time" }
+  ];
+  const payload = buildCrudFormPayload(fields, {
+    scheduledAt: "2024-01-02T03:04"
+  });
+
+  assert.match(payload.scheduledAt, /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.000Z$/);
+
+  const form = reactive({
+    scheduledAt: ""
+  });
+  applyCrudPayloadToForm(fields, form, payload);
+
+  assert.equal(form.scheduledAt, "2024-01-02T03:04");
+});
+
+test("buildCrudFormPayload normalizes time fields to canonical HH:MM", () => {
+  const fields = [
+    { key: "fromTime", type: "string", format: "time" },
+    { key: "toTime", type: "string", format: "time" }
+  ];
+
+  const payload = buildCrudFormPayload(fields, {
+    fromTime: "06:13 PM",
+    toTime: "18:45:00"
+  });
+
+  assert.deepEqual(payload, {
+    fromTime: "18:13",
+    toTime: "18:45"
+  });
+});
+
+test("buildCrudFormPayload serializes cleared nullable typed fields as null", () => {
+  const payload = buildCrudFormPayload(
+    [
+      { key: "serviceId", type: "integer", nullable: true },
+      { key: "fromDate", type: "string", format: "date", nullable: true },
+      { key: "scheduledAt", type: "string", format: "date-time", nullable: true },
+      { key: "fromTime", type: "string", format: "time", nullable: true }
+    ],
+    {
+      serviceId: null,
+      fromDate: "",
+      scheduledAt: "",
+      fromTime: ""
+    }
+  );
+
+  assert.deepEqual(payload, {
+    serviceId: null,
+    fromDate: null,
+    scheduledAt: null,
+    fromTime: null
+  });
+});
+
+test("applyCrudPayloadToForm normalizes time fields for form inputs", () => {
+  const fields = [
+    { key: "fromTime", type: "string", format: "time" },
+    { key: "toTime", type: "string", format: "time" }
+  ];
+  const form = reactive({
+    fromTime: "",
+    toTime: ""
+  });
+
+  applyCrudPayloadToForm(fields, form, {
+    fromTime: "18:13:00",
+    toTime: "06:45 PM"
+  });
+
+  assert.deepEqual(form, {
+    fromTime: "18:13",
+    toTime: "18:45"
+  });
+});
+
 test("applyCrudPayloadToForm maps payload values into reactive form model", () => {
   const form = reactive({
     name: "",

package/test/useCrudListParentTitle.test.js

@@ -0,0 +1,143 @@
+import assert from "node:assert/strict";
+import test from "node:test";
+import { resolveCrudListParentDescriptor, resolveCrudListParentRecordTitle, resolveCrudListParentTitleFromItems } from "../src/client/composables/internal/crudListParentTitleSupport.js";
+
+const contactChildResource = Object.freeze({
+  contract: {
+    lookup: {
+      containerKey: "lookups"
+    }
+  },
+  fieldMeta: Object.freeze([
+    Object.freeze({
+      key: "contactId",
+      relation: Object.freeze({
+        kind: "lookup",
+        namespace: "contacts",
+        valueKey: "id"
+      })
+    }),
+    Object.freeze({
+      key: "serviceId",
+      relation: Object.freeze({
+        kind: "lookup",
+        namespace: "services",
+        valueKey: "id"
+      })
+    })
+  ])
+});
+
+test("resolveCrudListParentDescriptor selects the nearest lookup route parent", () => {
+  const descriptor = resolveCrudListParentDescriptor({
+    resource: contactChildResource,
+    route: {
+      matched: [
+        { path: "/w/:workspaceSlug/admin" },
+        { path: "/w/:workspaceSlug/admin/contacts/:contactId/availabilities" }
+      ],
+      params: {
+        workspaceSlug: "dogandgroom",
+        contactId: "538779"
+      }
+    },
+    recordIdParam: "availabilityRuleId"
+  });
+
+  assert.deepEqual(
+    descriptor,
+    {
+      fieldKey: "contactId",
+      routeParamKey: "contactId",
+      relationNamespace: "contacts",
+      entityLabel: "Contact",
+      labelKey: "",
+      fieldDescriptor: {
+        key: "contactId",
+        relation: {
+          kind: "lookup",
+          valueKey: "id",
+          labelKey: "",
+          containerKey: "lookups"
+        }
+      },
+      apiUrlTemplate: "/contacts/:contactId"
+    }
+  );
+});
+
+test("resolveCrudListParentTitleFromItems uses the hydrated lookup label", () => {
+  const descriptor = resolveCrudListParentDescriptor({
+    resource: contactChildResource,
+    route: {
+      matched: [{ path: "/w/:workspaceSlug/admin/contacts/:contactId/availabilities" }],
+      params: {
+        workspaceSlug: "dogandgroom",
+        contactId: "538779"
+      }
+    },
+    recordIdParam: "availabilityRuleId"
+  });
+
+  const title = resolveCrudListParentTitleFromItems(
+    [
+      {
+        id: 1,
+        contactId: 538779,
+        lookups: {
+          contactId: {
+            id: 538779,
+            firstName: "Jessica",
+            lastName: "Dickinson"
+          }
+        }
+      }
+    ],
+    descriptor
+  );
+
+  assert.equal(title, "Jessica Dickinson");
+});
+
+test("resolveCrudListParentRecordTitle falls back to entity label plus id", () => {
+  const title = resolveCrudListParentRecordTitle(
+    {
+      id: 538779
+    },
+    {
+      entityLabel: "Contact",
+      labelKey: ""
+    }
+  );
+
+  assert.equal(title, "Contact #538779");
+});
+
+test("resolveCrudListParentDescriptor supports parentRouteParamKey aliases", () => {
+  const descriptor = resolveCrudListParentDescriptor({
+    resource: {
+      fieldMeta: [
+        {
+          key: "staffContactId",
+          parentRouteParamKey: "contactId",
+          relation: {
+            kind: "lookup",
+            namespace: "contacts",
+            valueKey: "id"
+          }
+        }
+      ]
+    },
+    route: {
+      matched: [{ path: "/w/:workspaceSlug/admin/contacts/:contactId/availabilities" }],
+      params: {
+        workspaceSlug: "dogandgroom",
+        contactId: "538779"
+      }
+    },
+    recordIdParam: "availabilityRuleId"
+  });
+
+  assert.equal(descriptor?.fieldKey, "staffContactId");
+  assert.equal(descriptor?.routeParamKey, "contactId");
+});

package/test/useListSearchSupport.test.js

@@ -3,7 +3,7 @@ import test from "node:test";
 import {
   normalizeListSearchConfig,
   matchesLocalSearch
-} from "../src/client/composables/listSearchSupport.js";
+} from "../src/client/composables/support/listSearchSupport.js";
 
 test("normalizeListSearchConfig defaults to disabled query search", () => {
   const config = normalizeListSearchConfig();

package/test/viewCoreLoading.test.js

@@ -1,7 +1,7 @@
 import assert from "node:assert/strict";
 import test from "node:test";
 import { ref } from "vue";
-import { useViewCore } from "../src/client/composables/useViewCore.js";
+import { useViewCore } from "../src/client/composables/runtime/useViewCore.js";
 
 test("useViewCore prefers resource isInitialLoading/isFetching signals when provided", () => {
   const resource = {

package/test/viewUiRuntime.test.js

@@ -1,7 +1,7 @@
 import assert from "node:assert/strict";
 import test from "node:test";
 import { ref } from "vue";
-import { createViewUiRuntime } from "../src/client/composables/viewUiRuntime.js";
+import { createViewUiRuntime } from "../src/client/composables/runtime/viewUiRuntime.js";
 
 test("createViewUiRuntime resolves api/list/edit paths with nested params", () => {
   const runtime = createViewUiRuntime({

package/src/client/composables/accountSettingsAvatarUploadRuntime.js

@@ -1,95 +0,0 @@
-import "@jskit-ai/uploads-image-web/client/styles";
-import { createImageUploadRuntime } from "@jskit-ai/uploads-image-web/client/composables/createImageUploadRuntime";
-import { resolveFieldErrors } from "@jskit-ai/http-runtime/client";
-import { usersWebHttpClient } from "../lib/httpClient.js";
-
-function createAccountSettingsAvatarUploadRuntime({
-  queryClient,
-  sessionQueryKey,
-  accountSettingsQueryKey,
-  selectedAvatarFileName,
-  applySettingsData,
-  reportAccountFeedback
-} = {}) {
-  async function resolveCsrfToken() {
-    const sessionPayload = await queryClient.fetchQuery({
-      queryKey: sessionQueryKey,
-      queryFn: () =>
-        usersWebHttpClient.request("/api/session", {
-          method: "GET"
-        }),
-      staleTime: 60_000
-    });
-
-    const csrfToken = String(sessionPayload?.csrfToken || "");
-    if (!csrfToken) {
-      throw new Error("Unable to prepare secure avatar upload request.");
-    }
-
-    return csrfToken;
-  }
-
-  return createImageUploadRuntime({
-    endpoint: "/api/settings/profile/avatar",
-    fieldName: "avatar",
-    resolveRequestHeaders: async () => ({
-      "csrf-token": await resolveCsrfToken()
-    }),
-    onSelectedFileNameChanged: (fileName) => {
-      selectedAvatarFileName.value = String(fileName || "");
-    },
-    onUploadSuccess: ({ data, uppy }) => {
-      applySettingsData(data);
-      queryClient.setQueryData(accountSettingsQueryKey, data);
-
-      const dashboard = uppy.getPlugin("Dashboard");
-      if (dashboard && typeof dashboard.closeModal === "function") {
-        dashboard.closeModal();
-      }
-
-      reportAccountFeedback({
-        message: "Avatar uploaded.",
-        severity: "success",
-        channel: "snackbar",
-        dedupeKey: "users-web.account-settings-runtime:avatar-uploaded"
-      });
-    },
-    onInvalidResponse: () => {
-      reportAccountFeedback({
-        message: "Avatar uploaded, but the response payload was invalid.",
-        severity: "error",
-        channel: "banner",
-        dedupeKey: "users-web.account-settings-runtime:avatar-upload-invalid-response"
-      });
-    },
-    onUploadError: ({ error, response }) => {
-      const body = response?.body && typeof response.body === "object" ? response.body : {};
-      const fieldErrors = resolveFieldErrors(body);
-
-      reportAccountFeedback({
-        message: String(fieldErrors.avatar || body?.error || error?.message || "Unable to upload avatar."),
-        severity: "error",
-        channel: "banner",
-        dedupeKey: "users-web.account-settings-runtime:avatar-upload-error"
-      });
-    },
-    onRestrictionFailed: ({ error }) => {
-      reportAccountFeedback({
-        message: String(error?.message || "Selected avatar file does not meet upload restrictions."),
-        severity: "error",
-        channel: "banner",
-        dedupeKey: "users-web.account-settings-runtime:avatar-upload-restriction"
-      });
-    },
-    onUnavailable: () => {
-      reportAccountFeedback({
-        message: "Avatar editor is unavailable in this environment.",
-        severity: "error",
-        channel: "banner",
-        dedupeKey: "users-web.account-settings-runtime:avatar-editor-unavailable"
-      });
-    }
-  });
-}
-
-export { createAccountSettingsAvatarUploadRuntime };

package/templates/packages/main/src/client/components/AccountPendingInvitesCue.vue

@@ -1,162 +0,0 @@
-<script setup>
-import { computed } from "vue";
-import { useRoute } from "vue-router";
-import { useQuery } from "@tanstack/vue-query";
-import { mdiEmailAlertOutline } from "@mdi/js";
-import { appendQueryString } from "@jskit-ai/kernel/shared/support";
-import {
-  useWebPlacementContext,
-  resolveSurfaceDefinitionFromPlacementContext,
-  resolveSurfacePathFromPlacementContext,
-  resolveSurfaceNavigationTargetFromPlacementContext
-} from "@jskit-ai/shell-web/client/placement";
-
-const { context: placementContext } = useWebPlacementContext();
-const route = useRoute();
-
-function normalizePendingInvitesCount(value) {
-  const numeric = Number(value);
-  if (!Number.isInteger(numeric) || numeric < 1) {
-    return 0;
-  }
-  return numeric;
-}
-
-function resolveReturnTo() {
-  const fullPath = String(route?.fullPath || "").trim();
-  if (fullPath.startsWith("/") && !fullPath.startsWith("//")) {
-    return fullPath;
-  }
-  const path = String(route?.path || "").trim();
-  if (path.startsWith("/") && !path.startsWith("//")) {
-    return path;
-  }
-  return "/";
-}
-
-function resolveReturnToHref() {
-  if (typeof window === "object" && window?.location?.href) {
-    return String(window.location.href || "").trim() || resolveReturnTo();
-  }
-  return resolveReturnTo();
-}
-
-function countPendingInvites(entries = []) {
-  if (!Array.isArray(entries)) {
-    return 0;
-  }
-
-  let total = 0;
-  for (const entry of entries) {
-    if (!entry || typeof entry !== "object") {
-      continue;
-    }
-    total += 1;
-  }
-  return total;
-}
-
-const authenticated = computed(() => placementContext.value?.auth?.authenticated === true);
-
-const bootstrapSummaryQuery = useQuery({
-  queryKey: ["local-main", "account", "invites-cue", "bootstrap"],
-  enabled: authenticated,
-  staleTime: 5_000,
-  refetchInterval: 15_000,
-  queryFn: async () => {
-    const response = await fetch("/api/bootstrap", {
-      method: "GET",
-      credentials: "include",
-      headers: {
-        accept: "application/json"
-      }
-    });
-    if (!response.ok) {
-      throw new Error(`Bootstrap request failed with status ${response.status}.`);
-    }
-
-    return response.json();
-  }
-});
-
-const placementPendingInvitesCount = computed(() =>
-  normalizePendingInvitesCount(placementContext.value?.pendingInvitesCount)
-);
-const bootstrapPendingInvitesCount = computed(() => {
-  const payload = bootstrapSummaryQuery.data.value;
-  const invitesEnabled = payload?.app?.features?.workspaceInvites === true;
-  if (!invitesEnabled) {
-    return 0;
-  }
-
-  return countPendingInvites(payload?.pendingInvites);
-});
-const pendingInvitesCount = computed(() =>
-  Math.max(placementPendingInvitesCount.value, bootstrapPendingInvitesCount.value)
-);
-
-const placementWorkspaceInvitesEnabled = computed(() => placementContext.value?.workspaceInvitesEnabled === true);
-const bootstrapWorkspaceInvitesEnabled = computed(() => {
-  const payload = bootstrapSummaryQuery.data.value;
-  return payload?.app?.features?.workspaceInvites === true;
-});
-const workspaceInvitesEnabled = computed(
-  () => placementWorkspaceInvitesEnabled.value || bootstrapWorkspaceInvitesEnabled.value
-);
-
-const isVisible = computed(() => {
-  return (
-    authenticated.value &&
-    workspaceInvitesEnabled.value &&
-    pendingInvitesCount.value > 0
-  );
-});
-
-const resolvedTo = computed(() => {
-  const hasAccountSurface = Boolean(resolveSurfaceDefinitionFromPlacementContext(placementContext.value, "account"));
-  const accountSettingsPath = hasAccountSurface
-    ? resolveSurfacePathFromPlacementContext(placementContext.value, "account", "/")
-    : "/account";
-  const accountSettingsNavigation = resolveSurfaceNavigationTargetFromPlacementContext(placementContext.value, {
-    path: accountSettingsPath,
-    surfaceId: "account"
-  });
-
-  const query = new URLSearchParams({
-    section: "invites",
-    returnTo: accountSettingsNavigation.sameOrigin ? resolveReturnTo() : resolveReturnToHref()
-  });
-  return appendQueryString(accountSettingsPath, query.toString());
-});
-
-const resolvedNavigationTarget = computed(() =>
-  resolveSurfaceNavigationTargetFromPlacementContext(placementContext.value, {
-    path: resolvedTo.value,
-    surfaceId: "account"
-  })
-);
-</script>
-
-<template>
-  <v-badge
-    v-if="isVisible"
-    color="error"
-    :content="pendingInvitesCount"
-    :model-value="pendingInvitesCount > 0"
-    bordered
-    offset-x="6"
-    offset-y="8"
-  >
-    <v-btn
-      :to="resolvedNavigationTarget.sameOrigin ? resolvedNavigationTarget.href : undefined"
-      :href="resolvedNavigationTarget.sameOrigin ? undefined : resolvedNavigationTarget.href"
-      variant="tonal"
-      color="warning"
-      :prepend-icon="mdiEmailAlertOutline"
-      size="small"
-      class="text-none"
-    >
-      Invites
-    </v-btn>
-  </v-badge>
-</template>

package/templates/src/components/WorkspaceNotFoundCard.vue

@@ -1,34 +0,0 @@
-<script setup>
-import { mdiAlertCircleOutline } from "@mdi/js";
-import { computed } from "vue";
-
-const props = defineProps({
-  surfaceLabel: {
-    type: String,
-    default: "Workspace"
-  },
-  message: {
-    type: String,
-    default: "Workspace is currently unavailable."
-  }
-});
-
-const normalizedSurfaceLabel = computed(() => String(props.surfaceLabel || "").trim() || "Workspace");
-const normalizedMessage = computed(() => String(props.message || "").trim() || "Workspace is currently unavailable.");
-</script>
-
-<template>
-  <v-card rounded="lg" elevation="1" border>
-    <v-card-item>
-      <template #prepend>
-        <v-icon :icon="mdiAlertCircleOutline" color="error" />
-      </template>
-      <v-card-title class="text-h5">Unavailable</v-card-title>
-      <v-card-subtitle>{{ normalizedSurfaceLabel }} surface.</v-card-subtitle>
-    </v-card-item>
-    <v-divider />
-    <v-card-text class="d-flex flex-column ga-4">
-      <p class="text-medium-emphasis mb-0">{{ normalizedMessage }}</p>
-    </v-card-text>
-  </v-card>
-</template>

package/templates/src/composables/useWorkspaceNotFoundState.js

@@ -1,41 +0,0 @@
-import { computed } from "vue";
-import { useRoute } from "vue-router";
-import { normalizeLowerText, normalizeObject } from "@jskit-ai/kernel/shared/support/normalize";
-import { useWebPlacementContext } from "@jskit-ai/shell-web/client/placement";
-
-const STATUS_MESSAGES = {
-  not_found: "The requested workspace was not found.",
-  forbidden: "You do not have access to this workspace.",
-  unauthenticated: "You need to sign in to access this workspace.",
-  error: "Workspace data could not be loaded right now."
-};
-const DEFAULT_WORKSPACE_UNAVAILABLE_MESSAGE = "Workspace is currently unavailable.";
-const RESOLVED_WORKSPACE_STATUS = "resolved";
-
-function useWorkspaceNotFoundState() {
-  const route = useRoute();
-  const { context: placementContext } = useWebPlacementContext();
-
-  const routeWorkspaceSlug = computed(() => normalizeLowerText(route?.params?.workspaceSlug));
-
-  const workspaceBootstrapStatus = computed(() => {
-    const statuses = normalizeObject(placementContext.value?.workspaceBootstrapStatuses);
-    return normalizeLowerText(statuses[routeWorkspaceSlug.value]);
-  });
-
-  const workspaceUnavailable = computed(
-    () => Boolean(workspaceBootstrapStatus.value) && workspaceBootstrapStatus.value !== RESOLVED_WORKSPACE_STATUS
-  );
-  const workspaceUnavailableMessage = computed(
-    () => STATUS_MESSAGES[workspaceBootstrapStatus.value] || DEFAULT_WORKSPACE_UNAVAILABLE_MESSAGE
-  );
-
-  return Object.freeze({
-    routeWorkspaceSlug,
-    workspaceBootstrapStatus,
-    workspaceUnavailable,
-    workspaceUnavailableMessage
-  });
-}
-
-export { useWorkspaceNotFoundState };

package/templates/src/pages/admin/members/index.vue

@@ -1,7 +0,0 @@
-<template>
-  <WorkspaceMembersClientElement />
-</template>
-
-<script setup>
-import WorkspaceMembersClientElement from "@jskit-ai/users-web/client/components/WorkspaceMembersClientElement";
-</script>

package/templates/src/pages/admin/workspace/settings/index.vue

@@ -1,16 +0,0 @@
-<template>
-  <section class="settings-page">
-    <ShellOutlet host="workspace-settings" position="forms" />
-  </section>
-</template>
-
-<script setup>
-import ShellOutlet from "@jskit-ai/shell-web/client/components/ShellOutlet";
-</script>
-
-<style scoped>
-.settings-page {
-  display: grid;
-  gap: 1rem;
-}
-</style>

package/templates/src/surfaces/admin/index.vue

@@ -1,29 +0,0 @@
-<script setup>
-import WorkspaceNotFoundCard from "@/components/WorkspaceNotFoundCard.vue";
-import { useWorkspaceNotFoundState } from "@/composables/useWorkspaceNotFoundState";
-
-const { workspaceUnavailable, workspaceUnavailableMessage } = useWorkspaceNotFoundState();
-</script>
-
-<template>
-  <WorkspaceNotFoundCard
-    v-if="workspaceUnavailable"
-    :message="workspaceUnavailableMessage"
-    surface-label="Admin"
-  />
-  <v-card v-else rounded="lg" elevation="1" border>
-    <v-card-item>
-      <template #prepend>
-        <v-chip color="primary" size="small" label>Admin</v-chip>
-      </template>
-      <v-card-title class="text-h5">Workspace Admin</v-card-title>
-      <v-card-subtitle>Privileged workspace workflows.</v-card-subtitle>
-    </v-card-item>
-    <v-divider />
-    <v-card-text class="d-flex flex-column ga-4">
-      <p class="text-medium-emphasis mb-0">
-        Use this area for workspace administration modules.
-      </p>
-    </v-card-text>
-  </v-card>
-</template>

package/templates/src/surfaces/admin/root.vue

@@ -1,20 +0,0 @@
-<route lang="json">
-{
-  "meta": {
-    "jskit": {
-      "surface": "admin"
-    }
-  }
-}
-</route>
-
-<script setup>
-import ShellLayout from "@/components/ShellLayout.vue";
-import { RouterView } from "vue-router";
-</script>
-
-<template>
-  <ShellLayout title="" subtitle="">
-    <RouterView />
-  </ShellLayout>
-</template>