@schandlergarcia/sf-web-components 2.3.17 → 2.4.0

package/brands/engine/app/hooks/useEvaAgent.ts

@@ -1,288 +0,0 @@
-/**
- * useEvaAgent — React hook for the Agentforce Agent REST API
- *
- * Handles the full lifecycle:
- *   1. OAuth client-credentials → access_token
- *   2. POST …/sessions → sessionId + message href
- *   3. POST …/messages → agent response text
- *   4. DELETE …/sessions → cleanup on unmount
- *
- * All HTTP calls go through the Vite proxy (see vite.config.ts):
- *   /sf-oauth/*  → myDomainUrl
- *   /sf-agent/*  → agentApiBaseUrl
- */
-
-import { useCallback, useEffect, useRef, useState } from "react";
-import { AGENT_API_CONFIG } from "@/config/agentApi";
-
-export interface AgentMessage {
-  role: "user" | "agent";
-  text: string;
-  id: string;
-  timestamp: string;
-}
-
-interface SessionState {
-  accessToken: string;
-  sessionId: string;
-  messagesHref: string;
-  endHref: string;
-}
-
-export default function useEvaAgent() {
-  const [messages, setMessages] = useState<AgentMessage[]>([]);
-  const [isConnecting, setIsConnecting] = useState(false);
-  const [isReady, setIsReady] = useState(false);
-  const [isSending, setIsSending] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  const sessionRef = useRef<SessionState | null>(null);
-  const sequenceRef = useRef(1);
-  const abortRef = useRef<AbortController | null>(null);
-
-  /* ── Step 1: OAuth token ──────────────────────────────── */
-  async function authenticate(signal: AbortSignal): Promise<string> {
-    const { clientId, clientSecret } = AGENT_API_CONFIG;
-
-    const body = new URLSearchParams({
-      grant_type: "client_credentials",
-      client_id: clientId,
-      client_secret: clientSecret,
-    });
-
-    const res = await fetch("/sf-oauth/services/oauth2/token", {
-      method: "POST",
-      headers: { "Content-Type": "application/x-www-form-urlencoded" },
-      body,
-      signal,
-    });
-
-    if (!res.ok) {
-      const text = await res.text();
-      throw new Error(`OAuth failed (${res.status}): ${text}`);
-    }
-
-    const data = await res.json();
-    return data.access_token;
-  }
-
-  /* ── Step 2: Create session ───────────────────────────── */
-  async function createSession(
-    accessToken: string,
-    signal: AbortSignal
-  ): Promise<Omit<SessionState, "accessToken">> {
-    const { agentId, bypassUser, demoTraveler, myDomainUrl } =
-      AGENT_API_CONFIG;
-
-    const payload = {
-      externalSessionKey: crypto.randomUUID(),
-      instanceConfig: { endpoint: myDomainUrl },
-      streamingCapabilities: { chunkTypes: ["Text"] },
-      bypassUser,
-      variables: [
-        {
-          name: "$Context.EndUserId",
-          type: "Text",
-          value: demoTraveler.contactId,
-        },
-        {
-          name: "$Context.EndUserEmail",
-          type: "Text",
-          value: demoTraveler.email,
-        },
-        {
-          name: "$Context.EndUserFirstName",
-          type: "Text",
-          value: demoTraveler.firstName,
-        },
-        {
-          name: "$Context.EndUserLastName",
-          type: "Text",
-          value: demoTraveler.lastName,
-        },
-      ],
-    };
-
-    const res = await fetch(
-      `/sf-agent/einstein/ai-agent/v1/agents/${agentId}/sessions`,
-      {
-        method: "POST",
-        headers: {
-          Authorization: `Bearer ${accessToken}`,
-          "Content-Type": "application/json",
-        },
-        body: JSON.stringify(payload),
-        signal,
-      }
-    );
-
-    if (!res.ok) {
-      const text = await res.text();
-      throw new Error(`Session creation failed (${res.status}): ${text}`);
-    }
-
-    const data = await res.json();
-    return {
-      sessionId: data.sessionId,
-      messagesHref: data._links?.messages?.href ?? "",
-      endHref: data._links?.end?.href ?? "",
-    };
-  }
-
-  /* ── Step 3: Send message ─────────────────────────────── */
-  const sendMessage = useCallback(async (text: string) => {
-    const session = sessionRef.current;
-    if (!session) return;
-
-    const userMsg: AgentMessage = {
-      role: "user",
-      text,
-      id: `user-${Date.now()}`,
-      timestamp: new Date().toISOString(),
-    };
-    setMessages((prev) => [...prev, userMsg]);
-    setIsSending(true);
-
-    try {
-      const seqId = sequenceRef.current++;
-
-      const messagesUrl = session.messagesHref.startsWith("http")
-        ? `/sf-agent${new URL(session.messagesHref).pathname}`
-        : `/sf-agent${session.messagesHref}`;
-
-      const res = await fetch(messagesUrl, {
-        method: "POST",
-        headers: {
-          Authorization: `Bearer ${session.accessToken}`,
-          "Content-Type": "application/json",
-          Accept: "application/json",
-        },
-        body: JSON.stringify({
-          message: { sequenceId: seqId, type: "Text", text },
-        }),
-      });
-
-      if (!res.ok) {
-        const errText = await res.text();
-        throw new Error(`Agent message failed (${res.status}): ${errText}`);
-      }
-
-      const data = await res.json();
-
-      const agentTexts: string[] = [];
-      if (Array.isArray(data.messages)) {
-        for (const m of data.messages) {
-          if (m.type === "Inform" && m.message) {
-            agentTexts.push(m.message);
-          } else if (m.type === "Text" && m.message) {
-            agentTexts.push(m.message);
-          }
-        }
-      }
-
-      const responseText =
-        agentTexts.length > 0
-          ? agentTexts.join("\n\n")
-          : data.message ?? "No response from agent.";
-
-      const agentMsg: AgentMessage = {
-        role: "agent",
-        text: responseText,
-        id: `agent-${Date.now()}`,
-        timestamp: new Date().toISOString(),
-      };
-      setMessages((prev) => [...prev, agentMsg]);
-    } catch (err: unknown) {
-      const msg = err instanceof Error ? err.message : "Unknown error";
-      setError(msg);
-      const errMsg: AgentMessage = {
-        role: "agent",
-        text: `Error: ${msg}`,
-        id: `error-${Date.now()}`,
-        timestamp: new Date().toISOString(),
-      };
-      setMessages((prev) => [...prev, errMsg]);
-    } finally {
-      setIsSending(false);
-    }
-  }, []);
-
-  /* ── Step 4: End session ──────────────────────────────── */
-  const endSession = useCallback(async () => {
-    const session = sessionRef.current;
-    if (!session) return;
-
-    try {
-      const endUrl = session.endHref.startsWith("http")
-        ? `/sf-agent${new URL(session.endHref).pathname}`
-        : `/sf-agent${session.endHref}`;
-
-      await fetch(endUrl, {
-        method: "DELETE",
-        headers: { Authorization: `Bearer ${session.accessToken}` },
-      });
-    } catch {
-      /* best-effort cleanup */
-    }
-
-    sessionRef.current = null;
-    setIsReady(false);
-  }, []);
-
-  /* ── Init: authenticate + create session on mount ─────── */
-  const connect = useCallback(async () => {
-    if (sessionRef.current) return;
-
-    abortRef.current = new AbortController();
-    const { signal } = abortRef.current;
-
-    setIsConnecting(true);
-    setError(null);
-
-    try {
-      const accessToken = await authenticate(signal);
-      const session = await createSession(accessToken, signal);
-
-      sessionRef.current = { accessToken, ...session };
-      sequenceRef.current = 1;
-      setIsReady(true);
-    } catch (err: unknown) {
-      if ((err as Error).name !== "AbortError") {
-        const msg = err instanceof Error ? err.message : "Connection failed";
-        setError(msg);
-      }
-    } finally {
-      setIsConnecting(false);
-    }
-  }, []);
-
-  /* ── Cleanup on unmount ───────────────────────────────── */
-  useEffect(() => {
-    return () => {
-      abortRef.current?.abort();
-      if (sessionRef.current) {
-        const session = sessionRef.current;
-        const endUrl = session.endHref.startsWith("http")
-          ? `/sf-agent${new URL(session.endHref).pathname}`
-          : `/sf-agent${session.endHref}`;
-
-        fetch(endUrl, {
-          method: "DELETE",
-          headers: { Authorization: `Bearer ${session.accessToken}` },
-        }).catch(() => {});
-        sessionRef.current = null;
-      }
-    };
-  }, []);
-
-  return {
-    messages,
-    isConnecting,
-    isReady,
-    isSending,
-    error,
-    connect,
-    sendMessage,
-    endSession,
-  };
-}

package/brands/engine/app/hooks/usePartnerDashboardData.ts

@@ -1,141 +0,0 @@
-import { createDataSDK, gql } from "@salesforce/sdk-data";
-import { useState, useEffect } from "react";
-import {
-  GET_CURRENT_USER,
-  GET_PARTNER_ACCOUNT,
-  FIND_PARTNER_ACCOUNT,
-  GET_CONTRACTS,
-  GET_INVOICES,
-  GET_PENALTIES,
-  GET_DISPUTES,
-  GET_PROPERTIES,
-} from "@/api/partnerQueries";
-
-/**
- * Hook to fetch live partner dashboard data from Salesforce
- *
- * Queries:
- * - Current partner Account data
- * - Partner's invoices, contracts, penalties, disputes
- *
- * Uses GraphQL via Data SDK for all queries
- */
-
-export function usePartnerDashboardData(partnerId?: string | null) {
-  const [data, setData] = useState<any>(null);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<Error | null>(null);
-
-  useEffect(() => {
-    async function fetchData() {
-      try {
-        const sdk = await createDataSDK();
-
-        // Get current user
-        const userResponse = await sdk.graphql?.(GET_CURRENT_USER);
-        console.log("Current User:", userResponse?.data?.uiapi?.currentUser);
-
-        if (userResponse?.errors?.length) {
-          console.error("User query errors:", userResponse.errors);
-          throw new Error(userResponse.errors.map((e: any) => e.message).join("; "));
-        }
-
-        const user = userResponse?.data?.uiapi?.currentUser;
-
-        // Use partnerId if provided, otherwise query for first partner account
-        let accountId = partnerId;
-
-        if (!accountId) {
-          // Query for partner accounts
-          const partnerAccountResponse = await sdk.graphql?.(FIND_PARTNER_ACCOUNT);
-          const firstPartner = partnerAccountResponse?.data?.uiapi?.query?.Account?.edges?.[0]?.node;
-
-          if (firstPartner) {
-            accountId = firstPartner.Id;
-            console.log("Using first Partner Account:", firstPartner.Name?.value, accountId);
-          } else {
-            console.warn("No Partner accounts found. Please create an Account with Type='Partner'");
-            setLoading(false);
-            return;
-          }
-        }
-
-        console.log("Fetching data for Account:", accountId);
-
-        // Fetch all partner data in parallel
-        const [
-          partnerResponse,
-          contractsResponse,
-          invoicesResponse,
-          penaltiesResponse,
-          disputesResponse,
-          propertiesResponse,
-        ] = await Promise.all([
-          sdk.graphql?.(GET_PARTNER_ACCOUNT, { accountId }),
-          sdk.graphql?.(GET_CONTRACTS, { accountId }),
-          sdk.graphql?.(GET_INVOICES, { accountId }),
-          sdk.graphql?.(GET_PENALTIES, { accountId }),
-          sdk.graphql?.(GET_DISPUTES, { accountId }),
-          sdk.graphql?.(GET_PROPERTIES, { accountId }),
-        ]);
-
-        // Check for errors
-        if (partnerResponse?.errors?.length) {
-          console.error("Partner query errors:", partnerResponse.errors);
-        }
-        if (contractsResponse?.errors?.length) {
-          console.error("Contracts query errors:", contractsResponse.errors);
-        }
-        if (invoicesResponse?.errors?.length) {
-          console.error("Invoices query errors:", invoicesResponse.errors);
-        }
-        if (penaltiesResponse?.errors?.length) {
-          console.error("Penalties query errors:", penaltiesResponse.errors);
-        }
-        if (disputesResponse?.errors?.length) {
-          console.error("Disputes query errors:", disputesResponse.errors);
-        }
-        if (propertiesResponse?.errors?.length) {
-          console.error("Properties query errors:", propertiesResponse.errors);
-        }
-
-        // Extract data
-        const partner = partnerResponse?.data?.uiapi?.query?.Account?.edges?.[0]?.node || null;
-        const contracts = contractsResponse?.data?.uiapi?.query?.Contract__c?.edges?.map((e: any) => e.node) ?? [];
-        const invoices = invoicesResponse?.data?.uiapi?.query?.Invoice__c?.edges?.map((e: any) => e.node) ?? [];
-        const penalties = penaltiesResponse?.data?.uiapi?.query?.Attrition_Penalty__c?.edges?.map((e: any) => e.node) ?? [];
-        const disputes = disputesResponse?.data?.uiapi?.query?.Case?.edges?.map((e: any) => e.node) ?? [];
-        const properties = propertiesResponse?.data?.uiapi?.query?.Property__c?.edges?.map((e: any) => e.node) ?? [];
-
-        console.log("Loaded partner data:", {
-          partner,
-          contracts: contracts.length,
-          invoices: invoices.length,
-          penalties: penalties.length,
-          disputes: disputes.length,
-          properties: properties.length,
-        });
-
-        setData({
-          user,
-          partner,
-          contracts,
-          invoices,
-          penalties,
-          disputes,
-          properties,
-        });
-
-        setLoading(false);
-      } catch (err) {
-        console.error("Data fetch error:", err);
-        setError(err as Error);
-        setLoading(false);
-      }
-    }
-
-    fetchData();
-  }, [partnerId]);
-
-  return { data, loading, error };
-}

package/brands/engine/app/navigationMenu.tsx

@@ -1,80 +0,0 @@
-import { Link, useLocation } from 'react-router';
-import { getAllRoutes } from './router-utils';
-import { useState } from 'react';
-
-export default function NavigationMenu() {
-  const [isOpen, setIsOpen] = useState(false);
-  const location = useLocation();
-
-  const isActive = (path: string) => location.pathname === path;
-
-  const toggleMenu = () => setIsOpen(!isOpen);
-
-  const navigationRoutes: { path: string; label: string }[] = getAllRoutes()
-    .filter(
-      route =>
-        route.handle?.showInNavigation === true &&
-        route.fullPath !== undefined &&
-        route.handle?.label !== undefined
-    )
-    .map(
-      route =>
-        ({
-          path: route.fullPath,
-          label: route.handle?.label,
-        }) as { path: string; label: string }
-    );
-
-  return (
-    <nav className="bg-white border-b border-gray-200">
-      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-        <div className="flex justify-between items-center h-16">
-          <Link to="/" className="text-xl font-semibold text-gray-900">
-            React App
-          </Link>
-          <button
-            onClick={toggleMenu}
-            className="p-2 rounded-md text-gray-700 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-blue-500"
-            aria-label="Toggle menu"
-          >
-            <div className="w-6 h-6 flex flex-col justify-center space-y-1.5">
-              <span
-                className={`block h-0.5 w-6 bg-current transition-all ${
-                  isOpen ? 'rotate-45 translate-y-2' : ''
-                }`}
-              />
-              <span
-                className={`block h-0.5 w-6 bg-current transition-all ${isOpen ? 'opacity-0' : ''}`}
-              />
-              <span
-                className={`block h-0.5 w-6 bg-current transition-all ${
-                  isOpen ? '-rotate-45 -translate-y-2' : ''
-                }`}
-              />
-            </div>
-          </button>
-        </div>
-        {isOpen && (
-          <div className="pb-4">
-            <div className="flex flex-col space-y-2">
-              {navigationRoutes.map(item => (
-                <Link
-                  key={item.path}
-                  to={item.path}
-                  onClick={() => setIsOpen(false)}
-                  className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${
-                    isActive(item.path)
-                      ? 'bg-blue-100 text-blue-700'
-                      : 'text-gray-700 hover:bg-gray-100'
-                  }`}
-                >
-                  {item.label}
-                </Link>
-              ))}
-            </div>
-          </div>
-        )}
-      </div>
-    </nav>
-  );
-}