@danainnovations/directory 0.1.1

package/README.md

@@ -0,0 +1,105 @@
+# @danainnovations/directory
+
+Sonance employee directory SDK. Zero-config access to the company's active directory (synced from Okta/AD via SCIM).
+
+## Install
+
+```bash
+npm install @danainnovations/directory
+```
+
+No environment variables or API keys needed. Just install and use.
+
+## React Hooks
+
+```tsx
+import { useUsers, useUser, useDepartments, useOrgChart } from '@danainnovations/directory'
+
+// Search and browse employees
+const { users, total, loading, error } = useUsers({ search: 'john', department: 'Engineering', page: 1, limit: 20 })
+
+// Look up a single user by email or ID
+const { user, loading, error } = useUser('john@sonance.com')
+
+// Get all departments with employee counts
+const { departments, loading, error } = useDepartments()
+
+// Get the full org chart (manager hierarchy tree)
+const { tree, loading, error } = useOrgChart()
+```
+
+## Async Functions
+
+For server-side, API routes, scripts, or non-React code:
+
+```ts
+import { getUsers, getUser, getDepartments, getOrgChart } from '@danainnovations/directory'
+
+const result = await getUsers({ search: 'sales', department: 'Sales', page: 1, limit: 50 })
+// result = { data: DirectoryUser[], total: number, page: number, limit: number, totalPages: number }
+
+const user = await getUser('john@sonance.com') // or pass a user ID
+// user = DirectoryUser | null
+
+const departments = await getDepartments()
+// departments = [{ name: 'Engineering', count: 42 }, ...]
+
+const tree = await getOrgChart()
+// tree = OrgNode[] (recursive tree with .reports[])
+```
+
+## Types
+
+```ts
+interface DirectoryUser {
+  id: string
+  email: string
+  full_name: string | null
+  given_name: string | null
+  family_name: string | null
+  department: string | null
+  job_title: string | null
+  location: string | null
+  phone_number: string | null
+  avatar_url: string | null
+  manager_email: string | null
+  role: string | null
+}
+
+interface Department {
+  name: string
+  count: number
+}
+
+interface OrgNode {
+  id: string
+  email: string
+  name: string
+  title: string | null
+  department: string | null
+  reports: OrgNode[]  // direct reports (recursive)
+}
+
+interface UserSearchParams {
+  search?: string      // searches name, email, department
+  department?: string  // exact department match
+  page?: number        // default: 1
+  limit?: number       // default: 50, max: 100
+}
+```
+
+## How It Works
+
+This package connects directly to a Supabase database that receives live SCIM provisioning from Okta. The data updates automatically whenever IT makes changes in Okta/Active Directory (new hires, terminations, department changes, etc.). Only active employees are returned — non-person accounts (service accounts, rooms, test users) are filtered out by row-level security.
+
+## AI Integration Notes
+
+When integrating this package into a project:
+- Use the React hooks (`useUsers`, `useUser`, `useDepartments`, `useOrgChart`) for client components
+- Use the async functions (`getUsers`, `getUser`, `getDepartments`, `getOrgChart`) for server components, API routes, or scripts
+- All hooks return `{ loading, error }` alongside the data
+- The `useUsers` hook re-fetches automatically when search params change
+- No providers, context, or setup needed — just import and use
+- For people pickers / autocomplete, use `useUsers({ search: inputValue })` with a debounced input
+- For org charts, `useOrgChart()` returns a tree — each node has a `.reports[]` array of direct reports
+- For department filters, `useDepartments()` returns departments sorted alphabetically with employee counts

package/dist/index.d.mts

@@ -0,0 +1,68 @@
+interface DirectoryUser {
+    id: string;
+    email: string;
+    full_name: string | null;
+    given_name: string | null;
+    family_name: string | null;
+    department: string | null;
+    job_title: string | null;
+    location: string | null;
+    phone_number: string | null;
+    avatar_url: string | null;
+    manager_email: string | null;
+    role: string | null;
+}
+interface UserSearchParams {
+    search?: string;
+    department?: string;
+    page?: number;
+    limit?: number;
+}
+interface UserSearchResult {
+    data: DirectoryUser[];
+    total: number;
+    page: number;
+    limit: number;
+    totalPages: number;
+}
+interface Department {
+    name: string;
+    count: number;
+}
+interface OrgNode {
+    id: string;
+    email: string;
+    name: string;
+    title: string | null;
+    department: string | null;
+    reports: OrgNode[];
+}
+
+declare function getUsers(params?: UserSearchParams): Promise<UserSearchResult>;
+declare function getUser(emailOrId: string): Promise<DirectoryUser | null>;
+declare function getDepartments(): Promise<Department[]>;
+declare function getOrgChart(): Promise<OrgNode[]>;
+
+declare function useUsers(params?: UserSearchParams): {
+    users: DirectoryUser[];
+    total: number;
+    loading: boolean;
+    error: Error | null;
+};
+declare function useUser(emailOrId: string | undefined | null): {
+    user: DirectoryUser | null;
+    loading: boolean;
+    error: Error | null;
+};
+declare function useDepartments(): {
+    departments: Department[];
+    loading: boolean;
+    error: Error | null;
+};
+declare function useOrgChart(): {
+    tree: OrgNode[];
+    loading: boolean;
+    error: Error | null;
+};
+
+export { type Department, type DirectoryUser, type OrgNode, type UserSearchParams, type UserSearchResult, getDepartments, getOrgChart, getUser, getUsers, useDepartments, useOrgChart, useUser, useUsers };

package/dist/index.d.ts

@@ -0,0 +1,68 @@
+interface DirectoryUser {
+    id: string;
+    email: string;
+    full_name: string | null;
+    given_name: string | null;
+    family_name: string | null;
+    department: string | null;
+    job_title: string | null;
+    location: string | null;
+    phone_number: string | null;
+    avatar_url: string | null;
+    manager_email: string | null;
+    role: string | null;
+}
+interface UserSearchParams {
+    search?: string;
+    department?: string;
+    page?: number;
+    limit?: number;
+}
+interface UserSearchResult {
+    data: DirectoryUser[];
+    total: number;
+    page: number;
+    limit: number;
+    totalPages: number;
+}
+interface Department {
+    name: string;
+    count: number;
+}
+interface OrgNode {
+    id: string;
+    email: string;
+    name: string;
+    title: string | null;
+    department: string | null;
+    reports: OrgNode[];
+}
+
+declare function getUsers(params?: UserSearchParams): Promise<UserSearchResult>;
+declare function getUser(emailOrId: string): Promise<DirectoryUser | null>;
+declare function getDepartments(): Promise<Department[]>;
+declare function getOrgChart(): Promise<OrgNode[]>;
+
+declare function useUsers(params?: UserSearchParams): {
+    users: DirectoryUser[];
+    total: number;
+    loading: boolean;
+    error: Error | null;
+};
+declare function useUser(emailOrId: string | undefined | null): {
+    user: DirectoryUser | null;
+    loading: boolean;
+    error: Error | null;
+};
+declare function useDepartments(): {
+    departments: Department[];
+    loading: boolean;
+    error: Error | null;
+};
+declare function useOrgChart(): {
+    tree: OrgNode[];
+    loading: boolean;
+    error: Error | null;
+};
+
+export { type Department, type DirectoryUser, type OrgNode, type UserSearchParams, type UserSearchResult, getDepartments, getOrgChart, getUser, getUsers, useDepartments, useOrgChart, useUser, useUsers };

package/dist/index.js

@@ -0,0 +1,245 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  getDepartments: () => getDepartments,
+  getOrgChart: () => getOrgChart,
+  getUser: () => getUser,
+  getUsers: () => getUsers,
+  useDepartments: () => useDepartments,
+  useOrgChart: () => useOrgChart,
+  useUser: () => useUser,
+  useUsers: () => useUsers
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/client.ts
+var import_supabase_js = require("@supabase/supabase-js");
+var SUPABASE_URL = "https://vfwtukipsinfkfjtivbw.supabase.co";
+var SUPABASE_ANON_KEY = "sb_publishable_V0y4tzcVuftRGEAdvwHloA_iQf7tPUz";
+var client = null;
+function getDirectoryClient() {
+  if (!client) {
+    client = (0, import_supabase_js.createClient)(SUPABASE_URL, SUPABASE_ANON_KEY, {
+      auth: {
+        autoRefreshToken: false,
+        persistSession: false
+      }
+    });
+  }
+  return client;
+}
+
+// src/queries.ts
+var USER_FIELDS = "id, email, full_name, given_name, family_name, department, job_title, location, phone_number, avatar_url, manager_email, role";
+async function getUsers(params) {
+  const supabase = getDirectoryClient();
+  const page = params?.page ?? 1;
+  const limit = Math.min(params?.limit ?? 50, 100);
+  const from = (page - 1) * limit;
+  const to = from + limit - 1;
+  let query = supabase.from("user_profiles").select(USER_FIELDS, { count: "exact" }).eq("scim_active", true).order("full_name").range(from, to);
+  if (params?.department) {
+    query = query.eq("department", params.department);
+  }
+  if (params?.search) {
+    query = query.or(
+      `full_name.ilike.%${params.search}%,email.ilike.%${params.search}%,department.ilike.%${params.search}%`
+    );
+  }
+  const { data, error, count } = await query;
+  if (error) throw new Error(error.message);
+  const total = count ?? 0;
+  return {
+    data: data ?? [],
+    total,
+    page,
+    limit,
+    totalPages: Math.ceil(total / limit)
+  };
+}
+async function getUser(emailOrId) {
+  const supabase = getDirectoryClient();
+  if (emailOrId.includes("@")) {
+    const { data: data2, error: error2 } = await supabase.from("user_profiles").select(USER_FIELDS).ilike("email", emailOrId).eq("scim_active", true).single();
+    if (!error2 && data2) return data2;
+  }
+  const { data, error } = await supabase.from("user_profiles").select(USER_FIELDS).eq("id", emailOrId).eq("scim_active", true).single();
+  if (error) return null;
+  return data;
+}
+async function getDepartments() {
+  const supabase = getDirectoryClient();
+  const { data, error } = await supabase.from("user_profiles").select("department").eq("scim_active", true).not("department", "is", null);
+  if (error) throw new Error(error.message);
+  const counts = /* @__PURE__ */ new Map();
+  for (const row of data ?? []) {
+    if (row.department) {
+      counts.set(row.department, (counts.get(row.department) ?? 0) + 1);
+    }
+  }
+  return Array.from(counts.entries()).map(([name, count]) => ({ name, count })).sort((a, b) => a.name.localeCompare(b.name));
+}
+async function getOrgChart() {
+  const supabase = getDirectoryClient();
+  const { data, error } = await supabase.from("user_profiles").select("id, email, full_name, job_title, department, manager_email").eq("scim_active", true);
+  if (error) throw new Error(error.message);
+  if (!data) return [];
+  const emailMap = /* @__PURE__ */ new Map();
+  for (const user of data) {
+    emailMap.set(user.email.toLowerCase(), user);
+  }
+  const childrenMap = /* @__PURE__ */ new Map();
+  const roots = [];
+  for (const user of data) {
+    const managerEmail = user.manager_email?.toLowerCase();
+    if (managerEmail && emailMap.has(managerEmail)) {
+      const children = childrenMap.get(managerEmail) ?? [];
+      children.push(user);
+      childrenMap.set(managerEmail, children);
+    } else {
+      roots.push(user);
+    }
+  }
+  function buildNode(user) {
+    const children = childrenMap.get(user.email.toLowerCase()) ?? [];
+    return {
+      id: user.id,
+      email: user.email,
+      name: user.full_name ?? user.email,
+      title: user.job_title,
+      department: user.department,
+      reports: children.map(buildNode)
+    };
+  }
+  return roots.map(buildNode);
+}
+
+// src/hooks.ts
+var import_react = require("react");
+function useUsers(params) {
+  const [users, setUsers] = (0, import_react.useState)([]);
+  const [total, setTotal] = (0, import_react.useState)(0);
+  const [loading, setLoading] = (0, import_react.useState)(true);
+  const [error, setError] = (0, import_react.useState)(null);
+  const search = params?.search;
+  const department = params?.department;
+  const page = params?.page;
+  const limit = params?.limit;
+  (0, import_react.useEffect)(() => {
+    let cancelled = false;
+    setLoading(true);
+    setError(null);
+    getUsers({ search, department, page, limit }).then((result) => {
+      if (!cancelled) {
+        setUsers(result.data);
+        setTotal(result.total);
+      }
+    }).catch((err) => {
+      if (!cancelled) setError(err);
+    }).finally(() => {
+      if (!cancelled) setLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [search, department, page, limit]);
+  return { users, total, loading, error };
+}
+function useUser(emailOrId) {
+  const [user, setUser] = (0, import_react.useState)(null);
+  const [loading, setLoading] = (0, import_react.useState)(true);
+  const [error, setError] = (0, import_react.useState)(null);
+  (0, import_react.useEffect)(() => {
+    if (!emailOrId) {
+      setUser(null);
+      setLoading(false);
+      return;
+    }
+    let cancelled = false;
+    setLoading(true);
+    setError(null);
+    getUser(emailOrId).then((result) => {
+      if (!cancelled) setUser(result);
+    }).catch((err) => {
+      if (!cancelled) setError(err);
+    }).finally(() => {
+      if (!cancelled) setLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [emailOrId]);
+  return { user, loading, error };
+}
+function useDepartments() {
+  const [departments, setDepartments] = (0, import_react.useState)([]);
+  const [loading, setLoading] = (0, import_react.useState)(true);
+  const [error, setError] = (0, import_react.useState)(null);
+  (0, import_react.useEffect)(() => {
+    let cancelled = false;
+    setLoading(true);
+    setError(null);
+    getDepartments().then((result) => {
+      if (!cancelled) setDepartments(result);
+    }).catch((err) => {
+      if (!cancelled) setError(err);
+    }).finally(() => {
+      if (!cancelled) setLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+  return { departments, loading, error };
+}
+function useOrgChart() {
+  const [tree, setTree] = (0, import_react.useState)([]);
+  const [loading, setLoading] = (0, import_react.useState)(true);
+  const [error, setError] = (0, import_react.useState)(null);
+  (0, import_react.useEffect)(() => {
+    let cancelled = false;
+    setLoading(true);
+    setError(null);
+    getOrgChart().then((result) => {
+      if (!cancelled) setTree(result);
+    }).catch((err) => {
+      if (!cancelled) setError(err);
+    }).finally(() => {
+      if (!cancelled) setLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+  return { tree, loading, error };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  getDepartments,
+  getOrgChart,
+  getUser,
+  getUsers,
+  useDepartments,
+  useOrgChart,
+  useUser,
+  useUsers
+});

package/dist/index.mjs

@@ -0,0 +1,211 @@
+// src/client.ts
+import { createClient } from "@supabase/supabase-js";
+var SUPABASE_URL = "https://vfwtukipsinfkfjtivbw.supabase.co";
+var SUPABASE_ANON_KEY = "sb_publishable_V0y4tzcVuftRGEAdvwHloA_iQf7tPUz";
+var client = null;
+function getDirectoryClient() {
+  if (!client) {
+    client = createClient(SUPABASE_URL, SUPABASE_ANON_KEY, {
+      auth: {
+        autoRefreshToken: false,
+        persistSession: false
+      }
+    });
+  }
+  return client;
+}
+
+// src/queries.ts
+var USER_FIELDS = "id, email, full_name, given_name, family_name, department, job_title, location, phone_number, avatar_url, manager_email, role";
+async function getUsers(params) {
+  const supabase = getDirectoryClient();
+  const page = params?.page ?? 1;
+  const limit = Math.min(params?.limit ?? 50, 100);
+  const from = (page - 1) * limit;
+  const to = from + limit - 1;
+  let query = supabase.from("user_profiles").select(USER_FIELDS, { count: "exact" }).eq("scim_active", true).order("full_name").range(from, to);
+  if (params?.department) {
+    query = query.eq("department", params.department);
+  }
+  if (params?.search) {
+    query = query.or(
+      `full_name.ilike.%${params.search}%,email.ilike.%${params.search}%,department.ilike.%${params.search}%`
+    );
+  }
+  const { data, error, count } = await query;
+  if (error) throw new Error(error.message);
+  const total = count ?? 0;
+  return {
+    data: data ?? [],
+    total,
+    page,
+    limit,
+    totalPages: Math.ceil(total / limit)
+  };
+}
+async function getUser(emailOrId) {
+  const supabase = getDirectoryClient();
+  if (emailOrId.includes("@")) {
+    const { data: data2, error: error2 } = await supabase.from("user_profiles").select(USER_FIELDS).ilike("email", emailOrId).eq("scim_active", true).single();
+    if (!error2 && data2) return data2;
+  }
+  const { data, error } = await supabase.from("user_profiles").select(USER_FIELDS).eq("id", emailOrId).eq("scim_active", true).single();
+  if (error) return null;
+  return data;
+}
+async function getDepartments() {
+  const supabase = getDirectoryClient();
+  const { data, error } = await supabase.from("user_profiles").select("department").eq("scim_active", true).not("department", "is", null);
+  if (error) throw new Error(error.message);
+  const counts = /* @__PURE__ */ new Map();
+  for (const row of data ?? []) {
+    if (row.department) {
+      counts.set(row.department, (counts.get(row.department) ?? 0) + 1);
+    }
+  }
+  return Array.from(counts.entries()).map(([name, count]) => ({ name, count })).sort((a, b) => a.name.localeCompare(b.name));
+}
+async function getOrgChart() {
+  const supabase = getDirectoryClient();
+  const { data, error } = await supabase.from("user_profiles").select("id, email, full_name, job_title, department, manager_email").eq("scim_active", true);
+  if (error) throw new Error(error.message);
+  if (!data) return [];
+  const emailMap = /* @__PURE__ */ new Map();
+  for (const user of data) {
+    emailMap.set(user.email.toLowerCase(), user);
+  }
+  const childrenMap = /* @__PURE__ */ new Map();
+  const roots = [];
+  for (const user of data) {
+    const managerEmail = user.manager_email?.toLowerCase();
+    if (managerEmail && emailMap.has(managerEmail)) {
+      const children = childrenMap.get(managerEmail) ?? [];
+      children.push(user);
+      childrenMap.set(managerEmail, children);
+    } else {
+      roots.push(user);
+    }
+  }
+  function buildNode(user) {
+    const children = childrenMap.get(user.email.toLowerCase()) ?? [];
+    return {
+      id: user.id,
+      email: user.email,
+      name: user.full_name ?? user.email,
+      title: user.job_title,
+      department: user.department,
+      reports: children.map(buildNode)
+    };
+  }
+  return roots.map(buildNode);
+}
+
+// src/hooks.ts
+import { useState, useEffect } from "react";
+function useUsers(params) {
+  const [users, setUsers] = useState([]);
+  const [total, setTotal] = useState(0);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  const search = params?.search;
+  const department = params?.department;
+  const page = params?.page;
+  const limit = params?.limit;
+  useEffect(() => {
+    let cancelled = false;
+    setLoading(true);
+    setError(null);
+    getUsers({ search, department, page, limit }).then((result) => {
+      if (!cancelled) {
+        setUsers(result.data);
+        setTotal(result.total);
+      }
+    }).catch((err) => {
+      if (!cancelled) setError(err);
+    }).finally(() => {
+      if (!cancelled) setLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [search, department, page, limit]);
+  return { users, total, loading, error };
+}
+function useUser(emailOrId) {
+  const [user, setUser] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  useEffect(() => {
+    if (!emailOrId) {
+      setUser(null);
+      setLoading(false);
+      return;
+    }
+    let cancelled = false;
+    setLoading(true);
+    setError(null);
+    getUser(emailOrId).then((result) => {
+      if (!cancelled) setUser(result);
+    }).catch((err) => {
+      if (!cancelled) setError(err);
+    }).finally(() => {
+      if (!cancelled) setLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [emailOrId]);
+  return { user, loading, error };
+}
+function useDepartments() {
+  const [departments, setDepartments] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  useEffect(() => {
+    let cancelled = false;
+    setLoading(true);
+    setError(null);
+    getDepartments().then((result) => {
+      if (!cancelled) setDepartments(result);
+    }).catch((err) => {
+      if (!cancelled) setError(err);
+    }).finally(() => {
+      if (!cancelled) setLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+  return { departments, loading, error };
+}
+function useOrgChart() {
+  const [tree, setTree] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  useEffect(() => {
+    let cancelled = false;
+    setLoading(true);
+    setError(null);
+    getOrgChart().then((result) => {
+      if (!cancelled) setTree(result);
+    }).catch((err) => {
+      if (!cancelled) setError(err);
+    }).finally(() => {
+      if (!cancelled) setLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+  return { tree, loading, error };
+}
+export {
+  getDepartments,
+  getOrgChart,
+  getUser,
+  getUsers,
+  useDepartments,
+  useOrgChart,
+  useUser,
+  useUsers
+};

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@danainnovations/directory",
+  "version": "0.1.1",
+  "description": "Sonance employee directory — zero-config React hooks and async functions",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "prepublishOnly": "npm run build"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    }
+  },
+  "dependencies": {
+    "@supabase/supabase-js": "^2.95.3"
+  },
+  "devDependencies": {
+    "@types/react": "^19.0.0",
+    "react": "^19.0.0",
+    "tsup": "^8.0.0",
+    "typescript": "^5.0.0"
+  },
+  "keywords": [
+    "sonance",
+    "directory",
+    "employee",
+    "okta",
+    "scim"
+  ],
+  "license": "UNLICENSED"
+}