synapse-react-client 4.0.21 → 4.0.22

package/dist/components/UserCardList/UserCardList.js

@@ -1,78 +1,55 @@
 import { MEDIUM_USER_CARD as e } from "../../utils/SynapseConstants.js";
-import { getUserProfileWithProfilePicAttached as t } from "../../utils/functions/getUserData.js";
+import { useGetUserProfilesWithProfilePicAttached as t } from "../../synapse-queries/user/useUserBundle.js";
 import { UserCard as n } from "../UserCard/UserCard.js";
-import { Component as r } from "react";
-import { without as i } from "lodash-es";
-import { jsx as a } from "react/jsx-runtime";
-import { ColumnTypeEnum as o } from "@sage-bionetworks/synapse-types";
+import { useMemo as r } from "react";
+import { jsx as i } from "react/jsx-runtime";
+import { ColumnTypeEnum as a } from "@sage-bionetworks/synapse-types";
 //#region src/components/UserCardList/UserCardList.tsx
-var s = class extends r {
-	constructor(e) {
-		super(e), this.state = { userProfileMap: {} }, this.update = this.update.bind(this);
-	}
-	componentDidMount() {
-		let { list: e } = this.props;
-		this.update(e);
-	}
-	componentDidUpdate(e) {
-		let t = e.list, n = i(this.props.list.filter((e) => e), ...t);
-		n.length > 0 && this.update(n);
-	}
-	update(e) {
-		t(e.filter((e) => !!e)).then((e) => {
-			let t = {};
-			e.list.forEach((e) => {
-				let { ownerId: n } = e;
-				t[n] = e;
-			}), this.setState({ userProfileMap: {
-				...this.state.userProfileMap,
-				...t
-			} });
-		}).catch((e) => {
-			console.error("Error on batch call =", e);
-		});
-	}
-	manuallyExtractData(e) {
-		let t = e.headers.findIndex((e) => e.name === "firstName"), n = e.headers.findIndex((e) => e.name === "lastName"), r = e.headers.findIndex((e) => e.name === "institution"), i = e.headers.findIndex((e) => e.columnType === o.USERID);
-		return e.rows.filter((e) => !e.values[i]).map((e) => {
-			let i = e.values;
-			return {
-				firstName: i[t] ?? "",
-				lastName: i[n] ?? "",
-				company: i[r] ?? void 0,
-				ownerId: null,
-				userName: i[t] ? i[t][0] ?? "" : ""
-			};
-		});
-	}
-	render() {
-		let { size: t = e, rowSet: r, list: i } = this.props, { userProfileMap: o = {} } = this.state, s = r && this.manuallyExtractData(r), c = 0;
-		return /* @__PURE__ */ a("div", {
-			className: "SRC-card-grid-row",
-			children: i.map((e) => {
-				let r = e == null ? null : o[e];
-				if (r) return /* @__PURE__ */ a("div", {
-					className: "SRC-grid-item SRC-narrow-grid-item",
-					children: /* @__PURE__ */ a(n, {
-						size: t,
-						preSignedURL: r.clientPreSignedURL,
-						userProfile: r
-					})
-				}, JSON.stringify(r));
-				let i = s && s[c];
-				return i ? (c += 1, /* @__PURE__ */ a("div", {
-					className: "SRC-grid-item SRC-narrow-grid-item",
-					children: /* @__PURE__ */ a(n, {
-						disableLink: !0,
-						hideEmail: !0,
-						size: t,
-						userProfile: i
-					})
-				}, JSON.stringify(i))) : !1;
-			})
-		});
-	}
-};
+function o(e) {
+	let t = e.headers.findIndex((e) => e.name === "firstName"), n = e.headers.findIndex((e) => e.name === "lastName"), r = e.headers.findIndex((e) => e.name === "institution"), i = e.headers.findIndex((e) => e.columnType === a.USERID);
+	return e.rows.filter((e) => !e.values[i]).map((e) => {
+		let i = e.values;
+		return {
+			firstName: i[t] ?? "",
+			lastName: i[n] ?? "",
+			company: i[r] ?? void 0,
+			ownerId: null,
+			userName: i[t] ? i[t][0] ?? "" : ""
+		};
+	});
+}
+function s(a) {
+	let { list: s, size: c = e, rowSet: l } = a, { data: u } = t(r(() => s.filter((e) => !!e), [s])), d = r(() => {
+		let e = {};
+		return u?.list.forEach((t) => {
+			t.ownerId && (e[t.ownerId] = t);
+		}), e;
+	}, [u]), f = l ? o(l) : void 0, p = 0;
+	return /* @__PURE__ */ i("div", {
+		className: "SRC-card-grid-row",
+		children: s.map((e) => {
+			let t = e == null ? null : d[e];
+			if (t) return /* @__PURE__ */ i("div", {
+				className: "SRC-grid-item SRC-narrow-grid-item",
+				children: /* @__PURE__ */ i(n, {
+					size: c,
+					preSignedURL: t.clientPreSignedURL,
+					userProfile: t
+				})
+			}, JSON.stringify(t));
+			let r = f && f[p];
+			return r ? (p += 1, /* @__PURE__ */ i("div", {
+				className: "SRC-grid-item SRC-narrow-grid-item",
+				children: /* @__PURE__ */ i(n, {
+					disableLink: !0,
+					hideEmail: !0,
+					size: c,
+					userProfile: r
+				})
+			}, JSON.stringify(r))) : !1;
+		})
+	});
+}
 //#endregion
 export { s as UserCardList, s as default };
 

package/dist/components/UserCardList/UserCardList.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserCardList.js","names":[],"sources":["../../../src/components/UserCardList/UserCardList.tsx"],"sourcesContent":["import { UserProfileList } from '@/synapse-client/SynapseClient'\nimport { getUserProfileWithProfilePicAttached } from '@/utils/functions/getUserData'\nimport { MEDIUM_USER_CARD, UserCardSize } from '@/utils/SynapseConstants'\nimport {\n  ColumnTypeEnum,\n  RowSet,\n  UserProfile,\n} from '@sage-bionetworks/synapse-types'\nimport { without } from 'lodash-es'\nimport { Component } from 'react'\nimport UserCard from '../UserCard/UserCard'\n\nexport type UserCardListProps = {\n  /* The list of user IDs or null values to render. For null values, the card will be rendered with table data supplied by `firstName`, `lastName`, and `institution` columns supplied by the data prop.  */\n  list: (string | null)[]\n  size?: UserCardSize\n  // Data should not be needed, however, it gives the option to fill in a user profile with other column\n  // fields. This is required specifically by AMP-AD Explore/People page\n  rowSet?: RowSet\n}\n\nexport type UserCardListState = {\n  userProfileMap: Record<string, UserProfile>\n}\nexport class UserCardList extends Component<\n  UserCardListProps,\n  UserCardListState\n> {\n  constructor(props: UserCardListProps) {\n    super(props)\n    this.state = {\n      userProfileMap: {},\n    }\n    this.update = this.update.bind(this)\n  }\n\n  componentDidMount() {\n    const { list } = this.props\n    this.update(list)\n  }\n\n  componentDidUpdate(prevProps: UserCardListProps) {\n    const priorListOfIds = prevProps.list\n    const newValues = without(\n      this.props.list.filter(el => el),\n      ...priorListOfIds,\n    )\n    // check that the props have changed by seeing that at least one element is different\n    if (newValues.length > 0) {\n      this.update(newValues)\n    }\n  }\n\n  update(list: (string | null)[]) {\n    getUserProfileWithProfilePicAttached(\n      list.filter((el): el is string => !!el),\n    )\n      .then((data: UserProfileList) => {\n        const newEntries: Record<string, UserProfile> = {}\n        data.list.forEach(el => {\n          const { ownerId } = el\n          newEntries[ownerId] = el\n        })\n        this.setState({\n          userProfileMap: { ...this.state.userProfileMap, ...newEntries },\n        })\n      })\n      .catch((err: string) => {\n        console.error('Error on batch call =', err)\n      })\n  }\n\n  /**\n   * Given data this will find rows where there is no userId columnType and create faux user profiles\n   * using firstName, lastName, and institution (company in UserProfile object).\n   * @param {RowSet} rowSet\n   * @returns list of UserProfiles with firstName, lastName, company, userName (first letter of firstName) filled out.\n   * @memberof UserCardList\n   */\n  manuallyExtractData(rowSet: RowSet) {\n    const firstNameIndex = rowSet.headers.findIndex(\n      el => el.name === 'firstName',\n    )\n    const lastNameIndex = rowSet.headers.findIndex(el => el.name === 'lastName')\n    const institutionIndex = rowSet.headers.findIndex(\n      el => el.name === 'institution',\n    )\n    const ownerId = rowSet.headers.findIndex(\n      el => el.columnType === ColumnTypeEnum.USERID,\n    )\n    const nullOwnerIdsRows = rowSet.rows.filter(el => !el.values[ownerId])\n    return nullOwnerIdsRows.map<Omit<UserProfile, 'ownerId'>>(el => {\n      const values = el.values\n      return {\n        firstName: values[firstNameIndex] ?? '',\n        lastName: values[lastNameIndex] ?? '',\n        company: values[institutionIndex] ?? undefined,\n        ownerId: null,\n        userName: values[firstNameIndex]\n          ? (values[firstNameIndex][0] ?? '')\n          : '',\n      }\n    })\n  }\n\n  render() {\n    const { size = MEDIUM_USER_CARD, rowSet, list } = this.props\n    const { userProfileMap = {} } = this.state\n    const fauxUserProfilesList = rowSet && this.manuallyExtractData(rowSet)\n    let fauxUserProfileIndex = 0\n    return (\n      <div className=\"SRC-card-grid-row\">\n        {\n          // we loop through the list from the props because thats the 'active set of data' whereas the data stored in state could be stale\n          list.map(ownerId => {\n            const userProfile = ownerId != null ? userProfileMap[ownerId] : null\n            if (userProfile) {\n              return (\n                <div\n                  key={JSON.stringify(userProfile)}\n                  className=\"SRC-grid-item SRC-narrow-grid-item\"\n                >\n                  <UserCard\n                    size={size}\n                    preSignedURL={userProfile.clientPreSignedURL}\n                    userProfile={userProfile}\n                  />\n                </div>\n              )\n            }\n            const fauxUserProfile =\n              fauxUserProfilesList && fauxUserProfilesList[fauxUserProfileIndex]\n            if (!fauxUserProfile) {\n              // This could happen in one of two cases:\n              // - The props just updated with a new userlist where the data is being gathered for this particular user\n              //   OR there is no mapping for this user\n              return false\n            }\n            fauxUserProfileIndex += 1\n            return (\n              <div\n                key={JSON.stringify(fauxUserProfile)}\n                className=\"SRC-grid-item SRC-narrow-grid-item\"\n              >\n                <UserCard\n                  disableLink={true}\n                  hideEmail={true}\n                  size={size}\n                  // TODO: Modify UserCard to accept a fake profile with no ownerId field, and remove this cast.\n                  userProfile={fauxUserProfile as UserProfile}\n                />\n              </div>\n            )\n          })\n        }\n      </div>\n    )\n  }\n}\nexport default UserCardList\n"],"mappings":";;;;;;;;AAwBA,IAAa,IAAb,cAAkC,EAGhC;CACA,YAAY,GAA0B;EAKpC,AAJA,MAAM,CAAK,GACX,KAAK,QAAQ,EACX,gBAAgB,CAAC,EACnB,GACA,KAAK,SAAS,KAAK,OAAO,KAAK,IAAI;CACrC;CAEA,oBAAoB;EAClB,IAAM,EAAE,YAAS,KAAK;EACtB,KAAK,OAAO,CAAI;CAClB;CAEA,mBAAmB,GAA8B;EAC/C,IAAM,IAAiB,EAAU,MAC3B,IAAY,EAChB,KAAK,MAAM,KAAK,QAAO,MAAM,CAAE,GAC/B,GAAG,CACL;EAEA,AAAI,EAAU,SAAS,KACrB,KAAK,OAAO,CAAS;CAEzB;CAEA,OAAO,GAAyB;EAC9B,EACE,EAAK,QAAQ,MAAqB,CAAC,CAAC,CAAE,CACxC,EACG,MAAM,MAA0B;GAC/B,IAAM,IAA0C,CAAC;GAKjD,AAJA,EAAK,KAAK,SAAQ,MAAM;IACtB,IAAM,EAAE,eAAY;IACpB,EAAW,KAAW;GACxB,CAAC,GACD,KAAK,SAAS,EACZ,gBAAgB;IAAE,GAAG,KAAK,MAAM;IAAgB,GAAG;GAAW,EAChE,CAAC;EACH,CAAC,EACA,OAAO,MAAgB;GACtB,QAAQ,MAAM,yBAAyB,CAAG;EAC5C,CAAC;CACL;CASA,oBAAoB,GAAgB;EAClC,IAAM,IAAiB,EAAO,QAAQ,WACpC,MAAM,EAAG,SAAS,WACpB,GACM,IAAgB,EAAO,QAAQ,WAAU,MAAM,EAAG,SAAS,UAAU,GACrE,IAAmB,EAAO,QAAQ,WACtC,MAAM,EAAG,SAAS,aACpB,GACM,IAAU,EAAO,QAAQ,WAC7B,MAAM,EAAG,eAAe,EAAe,MACzC;EAEA,OADyB,EAAO,KAAK,QAAO,MAAM,CAAC,EAAG,OAAO,EACtD,EAAiB,KAAkC,MAAM;GAC9D,IAAM,IAAS,EAAG;GAClB,OAAO;IACL,WAAW,EAAO,MAAmB;IACrC,UAAU,EAAO,MAAkB;IACnC,SAAS,EAAO,MAAqB,KAAA;IACrC,SAAS;IACT,UAAU,EAAO,KACZ,EAAO,GAAgB,MAAM,KAC9B;GACN;EACF,CAAC;CACH;CAEA,SAAS;EACP,IAAM,EAAE,UAAO,GAAkB,WAAQ,YAAS,KAAK,OACjD,EAAE,oBAAiB,CAAC,MAAM,KAAK,OAC/B,IAAuB,KAAU,KAAK,oBAAoB,CAAM,GAClE,IAAuB;EAC3B,OACE,kBAAC,OAAD;GAAK,WAAU;aAGX,EAAK,KAAI,MAAW;IAClB,IAAM,IAAc,KAAW,OAAiC,OAA1B,EAAe;IACrD,IAAI,GACF,OACE,kBAAC,OAAD;KAEE,WAAU;eAEV,kBAAC,GAAD;MACQ;MACN,cAAc,EAAY;MACb;KACd,CAAA;IACE,GARE,KAAK,UAAU,CAAW,CAQ5B;IAGT,IAAM,IACJ,KAAwB,EAAqB;IAQ/C,OAPK,KAML,KAAwB,GAEtB,kBAAC,OAAD;KAEE,WAAU;eAEV,kBAAC,GAAD;MACE,aAAa;MACb,WAAW;MACL;MAEN,aAAa;KACd,CAAA;IACE,GAVE,KAAK,UAAU,CAAe,CAUhC,KAfE;GAiBX,CAAC;EAEA,CAAA;CAET;AACF"}
+{"version":3,"file":"UserCardList.js","names":[],"sources":["../../../src/components/UserCardList/UserCardList.tsx"],"sourcesContent":["import { useGetUserProfilesWithProfilePicAttached } from '@/synapse-queries/user/useUserBundle'\nimport { MEDIUM_USER_CARD, UserCardSize } from '@/utils/SynapseConstants'\nimport {\n  ColumnTypeEnum,\n  RowSet,\n  UserProfile,\n} from '@sage-bionetworks/synapse-types'\nimport { useMemo } from 'react'\nimport UserCard from '../UserCard/UserCard'\n\nexport type UserCardListProps = {\n  /* The list of user IDs or null values to render. For null values, the card will be rendered with table data supplied by `firstName`, `lastName`, and `institution` columns supplied by the data prop.  */\n  list: (string | null)[]\n  size?: UserCardSize\n  // Data should not be needed, however, it gives the option to fill in a user profile with other column\n  // fields. This is required specifically by AMP-AD Explore/People page\n  rowSet?: RowSet\n}\n\n/**\n * Given a RowSet, extracts faux user profiles for rows where ownerId is null,\n * using firstName, lastName, and institution columns.\n */\nfunction extractFauxUserProfiles(\n  rowSet: RowSet,\n): Omit<UserProfile, 'ownerId'>[] {\n  const firstNameIndex = rowSet.headers.findIndex(el => el.name === 'firstName')\n  const lastNameIndex = rowSet.headers.findIndex(el => el.name === 'lastName')\n  const institutionIndex = rowSet.headers.findIndex(\n    el => el.name === 'institution',\n  )\n  const ownerIdIndex = rowSet.headers.findIndex(\n    el => el.columnType === ColumnTypeEnum.USERID,\n  )\n  const nullOwnerIdsRows = rowSet.rows.filter(el => !el.values[ownerIdIndex])\n  return nullOwnerIdsRows.map(el => {\n    const values = el.values\n    return {\n      firstName: values[firstNameIndex] ?? '',\n      lastName: values[lastNameIndex] ?? '',\n      company: values[institutionIndex] ?? undefined,\n      ownerId: null,\n      userName: values[firstNameIndex] ? (values[firstNameIndex][0] ?? '') : '',\n    }\n  })\n}\n\nexport function UserCardList(props: UserCardListProps) {\n  const { list, size = MEDIUM_USER_CARD, rowSet } = props\n\n  const principalIds = useMemo(\n    () => list.filter((el): el is string => !!el),\n    [list],\n  )\n\n  const { data } = useGetUserProfilesWithProfilePicAttached(principalIds)\n\n  const userProfileMap = useMemo(() => {\n    const map: Record<string, UserProfile> = {}\n    data?.list.forEach(profile => {\n      if (profile.ownerId) {\n        map[profile.ownerId] = profile\n      }\n    })\n    return map\n  }, [data])\n\n  const fauxUserProfilesList = rowSet\n    ? extractFauxUserProfiles(rowSet)\n    : undefined\n  let fauxUserProfileIndex = 0\n\n  return (\n    <div className=\"SRC-card-grid-row\">\n      {list.map(ownerId => {\n        const userProfile = ownerId != null ? userProfileMap[ownerId] : null\n        if (userProfile) {\n          return (\n            <div\n              key={JSON.stringify(userProfile)}\n              className=\"SRC-grid-item SRC-narrow-grid-item\"\n            >\n              <UserCard\n                size={size}\n                preSignedURL={userProfile.clientPreSignedURL}\n                userProfile={userProfile}\n              />\n            </div>\n          )\n        }\n        const fauxUserProfile =\n          fauxUserProfilesList && fauxUserProfilesList[fauxUserProfileIndex]\n        if (!fauxUserProfile) {\n          return false\n        }\n        fauxUserProfileIndex += 1\n        return (\n          <div\n            key={JSON.stringify(fauxUserProfile)}\n            className=\"SRC-grid-item SRC-narrow-grid-item\"\n          >\n            <UserCard\n              disableLink={true}\n              hideEmail={true}\n              size={size}\n              // TODO: Modify UserCard to accept a fake profile with no ownerId field, and remove this cast.\n              userProfile={fauxUserProfile as UserProfile}\n            />\n          </div>\n        )\n      })}\n    </div>\n  )\n}\n\nexport default UserCardList\n"],"mappings":";;;;;;;AAuBA,SAAS,EACP,GACgC;CAChC,IAAM,IAAiB,EAAO,QAAQ,WAAU,MAAM,EAAG,SAAS,WAAW,GACvE,IAAgB,EAAO,QAAQ,WAAU,MAAM,EAAG,SAAS,UAAU,GACrE,IAAmB,EAAO,QAAQ,WACtC,MAAM,EAAG,SAAS,aACpB,GACM,IAAe,EAAO,QAAQ,WAClC,MAAM,EAAG,eAAe,EAAe,MACzC;CAEA,OADyB,EAAO,KAAK,QAAO,MAAM,CAAC,EAAG,OAAO,EACtD,EAAiB,KAAI,MAAM;EAChC,IAAM,IAAS,EAAG;EAClB,OAAO;GACL,WAAW,EAAO,MAAmB;GACrC,UAAU,EAAO,MAAkB;GACnC,SAAS,EAAO,MAAqB,KAAA;GACrC,SAAS;GACT,UAAU,EAAO,KAAmB,EAAO,GAAgB,MAAM,KAAM;EACzE;CACF,CAAC;AACH;AAEA,SAAgB,EAAa,GAA0B;CACrD,IAAM,EAAE,SAAM,UAAO,GAAkB,cAAW,GAO5C,EAAE,YAAS,EALI,QACb,EAAK,QAAQ,MAAqB,CAAC,CAAC,CAAE,GAC5C,CAAC,CAAI,CAGmD,CAAY,GAEhE,IAAiB,QAAc;EACnC,IAAM,IAAmC,CAAC;EAM1C,OALA,GAAM,KAAK,SAAQ,MAAW;GAC5B,AAAI,EAAQ,YACV,EAAI,EAAQ,WAAW;EAE3B,CAAC,GACM;CACT,GAAG,CAAC,CAAI,CAAC,GAEH,IAAuB,IACzB,EAAwB,CAAM,IAC9B,KAAA,GACA,IAAuB;CAE3B,OACE,kBAAC,OAAD;EAAK,WAAU;YACZ,EAAK,KAAI,MAAW;GACnB,IAAM,IAAc,KAAW,OAAiC,OAA1B,EAAe;GACrD,IAAI,GACF,OACE,kBAAC,OAAD;IAEE,WAAU;cAEV,kBAAC,GAAD;KACQ;KACN,cAAc,EAAY;KACb;IACd,CAAA;GACE,GARE,KAAK,UAAU,CAAW,CAQ5B;GAGT,IAAM,IACJ,KAAwB,EAAqB;GAK/C,OAJK,KAGL,KAAwB,GAEtB,kBAAC,OAAD;IAEE,WAAU;cAEV,kBAAC,GAAD;KACE,aAAa;KACb,WAAW;KACL;KAEN,aAAa;IACd,CAAA;GACE,GAVE,KAAK,UAAU,CAAe,CAUhC,KAfE;EAiBX,CAAC;CACE,CAAA;AAET"}

package/dist/components/UserCardList/UserCardListRotate.d.ts

@@ -1,6 +1,7 @@
 import { SQLOperator } from '@/utils/functions/SqlFunctions';
 import { UserCardSize } from '@/utils/SynapseConstants';
 import { FacetColumnRequest } from '@sage-bionetworks/synapse-types';
+import { QueryClient } from '@tanstack/react-query';
 export type UserCardListRotateProps = {
     sql: string;
     count: number;
@@ -16,4 +17,16 @@ export type UserCardListRotateProps = {
 export declare const getDisplayIds: (ids: string[] | undefined, count: number | undefined, storageUidKey: string) => string[];
 export declare function UserCardListRotate({ sql, count, useQueryResultUserData, size, summaryLink, summaryLinkText, selectedFacets, searchParams, sqlOperator, additionalFiltersSessionStorageKey, }: UserCardListRotateProps): import("react/jsx-runtime").JSX.Element;
 export default UserCardListRotate;
+/**
+ * Prefetches the UserCardListRotate table query and the user profiles it
+ * references into a QueryClient for use with HydrationBoundary. Uses anonymous
+ * access; warm-caches for unauthenticated users.
+ */
+export declare function prefetchUserCardListRotate(queryClient: QueryClient, sql: string, options?: {
+    selectedFacets?: FacetColumnRequest[];
+    searchParams?: Record<string, string>;
+    sqlOperator?: SQLOperator;
+    additionalFiltersSessionStorageKey?: string;
+    count?: number;
+}): Promise<void>;
 //# sourceMappingURL=UserCardListRotate.d.ts.map

package/dist/components/UserCardList/UserCardListRotate.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UserCardListRotate.d.ts","sourceRoot":"","sources":["../../../src/components/UserCardList/UserCardListRotate.tsx"],"names":[],"mappings":"AAIA,OAAO,EAGL,WAAW,EACZ,MAAM,gCAAgC,CAAA;AACvC,OAAO,EAAmB,YAAY,EAAE,MAAM,0BAA0B,CAAA;AACxE,OAAO,EAEL,kBAAkB,EAGnB,MAAM,iCAAiC,CAAA;AASxC,MAAM,MAAM,uBAAuB,GAAG;IACpC,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;IACb,sBAAsB,CAAC,EAAE,OAAO,CAAA;IAChC,IAAI,CAAC,EAAE,YAAY,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,cAAc,CAAC,EAAE,kBAAkB,EAAE,CAAA;IACrC,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACrC,kCAAkC,CAAC,EAAE,MAAM,CAAA;CAC5C,CAAA;AAED,eAAO,MAAM,aAAa,GACxB,KAAK,MAAM,EAAE,YAAK,EAClB,OAAO,MAAM,YAAwB,EACrC,eAAe,MAAM,aA8BtB,CAAA;AAED,wBAAgB,kBAAkB,CAAC,EACjC,GAAG,EACH,KAAK,EACL,sBAA8B,EAC9B,IAAsB,EACtB,WAAW,EACX,eAAe,EACf,cAAc,EACd,YAAY,EACZ,WAAW,EACX,kCAAkC,GACnC,EAAE,uBAAuB,2CAoFzB;AAED,eAAe,kBAAkB,CAAA"}
+{"version":3,"file":"UserCardListRotate.d.ts","sourceRoot":"","sources":["../../../src/components/UserCardList/UserCardListRotate.tsx"],"names":[],"mappings":"AAOA,OAAO,EAGL,WAAW,EACZ,MAAM,gCAAgC,CAAA;AACvC,OAAO,EAAmB,YAAY,EAAE,MAAM,0BAA0B,CAAA;AACxE,OAAO,EAEL,kBAAkB,EAGnB,MAAM,iCAAiC,CAAA;AACxC,OAAO,EAAE,WAAW,EAAY,MAAM,uBAAuB,CAAA;AAQ7D,MAAM,MAAM,uBAAuB,GAAG;IACpC,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;IACb,sBAAsB,CAAC,EAAE,OAAO,CAAA;IAChC,IAAI,CAAC,EAAE,YAAY,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,cAAc,CAAC,EAAE,kBAAkB,EAAE,CAAA;IACrC,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACrC,kCAAkC,CAAC,EAAE,MAAM,CAAA;CAC5C,CAAA;AAED,eAAO,MAAM,aAAa,GACxB,KAAK,MAAM,EAAE,YAAK,EAClB,OAAO,MAAM,YAAwB,EACrC,eAAe,MAAM,KACpB,MAAM,EAgCR,CAAA;AA0CD,wBAAgB,kBAAkB,CAAC,EACjC,GAAG,EACH,KAAK,EACL,sBAA8B,EAC9B,IAAsB,EACtB,WAAW,EACX,eAAe,EACf,cAAc,EACd,YAAY,EACZ,WAAW,EACX,kCAAkC,GACnC,EAAE,uBAAuB,2CAiEzB;AAED,eAAe,kBAAkB,CAAA;AAEjC;;;;GAIG;AACH,wBAAsB,0BAA0B,CAC9C,WAAW,EAAE,WAAW,EACxB,GAAG,EAAE,MAAM,EACX,OAAO,CAAC,EAAE;IACR,cAAc,CAAC,EAAE,kBAAkB,EAAE,CAAA;IACrC,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACrC,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,kCAAkC,CAAC,EAAE,MAAM,CAAA;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,GACA,OAAO,CAAC,IAAI,CAAC,CA0Bf"}

package/dist/components/UserCardList/UserCardListRotate.js

@@ -1,81 +1,106 @@
 import { LARGE_USER_CARD as e } from "../../utils/SynapseConstants.js";
 import t from "../../synapse-client/index.js";
 import { getAdditionalFilters as n, parseEntityIdFromSqlStatement as r } from "../../utils/functions/SqlFunctions.js";
-import { useSynapseContext as i } from "../../utils/context/SynapseContext.js";
+import { KeyFactory as i } from "../../synapse-queries/KeyFactory.js";
+import { useSynapseContext as a } from "../../utils/context/SynapseContext.js";
 import "../../utils/index.js";
-import { LoadingUserCardMedium as a } from "../UserCard/UserCardMedium.js";
-import { UserCardList as o } from "./UserCardList.js";
-import { LargeButton as s } from "../styled/LargeButton.js";
-import { useState as c } from "react";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
-import { ColumnTypeEnum as d } from "@sage-bionetworks/synapse-types";
-import { useDeepCompareEffectNoCheck as f } from "use-deep-compare-effect";
+import { tableQueryUseQueryDefaults as o } from "../../synapse-queries/entity/useGetQueryResultBundle.js";
+import { getUserProfilesWithProfilePicAttachedQueryOptions as s } from "../../synapse-queries/user/useUserBundle.js";
+import { LoadingUserCardMedium as c } from "../UserCard/UserCardMedium.js";
+import { UserCardList as l } from "./UserCardList.js";
+import { LargeButton as u } from "../styled/LargeButton.js";
+import { useEffect as d, useMemo as f, useRef as p, useState as m } from "react";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { ColumnTypeEnum as _ } from "@sage-bionetworks/synapse-types";
+import { useQuery as v } from "@tanstack/react-query";
 //#region src/components/UserCardList/UserCardListRotate.tsx
-var p = "sage_rotate_uids", m = 3, h = (e = [], t = m, n) => {
-	let r = [], i = [], a = localStorage.getItem(n);
-	if (a != null && (r = JSON.parse(a)), r.length) {
-		let a = e.filter((e) => !r.includes(e));
-		if (a.length >= t) return i = a.slice(0, t), localStorage.setItem(n, JSON.stringify(r.concat(i))), i;
-		{
-			localStorage.removeItem(n);
-			let r = e.slice(0, t - a.length);
-			return localStorage.setItem(n, JSON.stringify(r)), a.concat(r);
-		}
-	} else return i = e.slice(0, t), localStorage.setItem(n, JSON.stringify(i)), i;
+var y = "sage_rotate_uids", b = 3, x = (e = [], t = b, n) => {
+	if (typeof localStorage > "u") return e.slice(0, t);
+	let r = localStorage.getItem(n), i = r ? JSON.parse(r) : [];
+	if (!i.length) {
+		let r = e.slice(0, t);
+		return localStorage.setItem(n, JSON.stringify(r)), r;
+	}
+	let a = new Set(i), o = e.filter((e) => !a.has(e));
+	if (o.length >= t) {
+		let e = o.slice(0, t);
+		return localStorage.setItem(n, JSON.stringify([...i, ...e])), e;
+	}
+	let s = e.slice(0, t - o.length);
+	return localStorage.setItem(n, JSON.stringify(s)), [...o, ...s];
 };
-function g({ sql: m, count: g, useQueryResultUserData: _ = !1, size: v = e, summaryLink: y, summaryLinkText: b, selectedFacets: x, searchParams: S, sqlOperator: C, additionalFiltersSessionStorageKey: w }) {
-	let { accessToken: T } = i(), [E, D] = c([]), [O, k] = c(), [A, j] = c(), M = !0, N = `${p}-${m}-${JSON.stringify(x)}`;
-	return f(() => (async function() {
-		j(!0);
-		let e = {
-			partMask: 1,
-			concreteType: "org.sagebionetworks.repo.model.table.QueryBundleRequest",
-			entityId: r(m),
-			query: {
-				sql: m,
-				additionalFilters: n(S, C, w),
-				selectedFacets: x
-			}
-		}, i = await t.getFullQueryTableResults(e, T), { queryResult: a } = i;
-		if (a?.queryResults.rows) {
-			let e = a.queryResults.headers.findIndex((e) => e.columnType === d.USERID), t = a.queryResults.rows.map((t) => t.values[e]).filter((e) => e !== null);
-			M && (D(h(t, g, N)), _ && k(i), j(!1));
-		} else console.log("UserCardListRotate: Error getting data");
-	}(), () => {
-		M = !1;
-	}), [
-		m,
-		x,
-		g,
-		T,
-		S,
-		C
-	]), /* @__PURE__ */ u("div", {
+function S(e, t) {
+	return {
+		partMask: 1,
+		concreteType: "org.sagebionetworks.repo.model.table.QueryBundleRequest",
+		entityId: r(e),
+		query: {
+			sql: e,
+			additionalFilters: n(t?.searchParams, t?.sqlOperator, t?.additionalFiltersSessionStorageKey),
+			selectedFacets: t?.selectedFacets
+		}
+	};
+}
+function C(e) {
+	if (!e?.queryResult?.queryResults.rows) return [];
+	let t = e.queryResult.queryResults.headers.findIndex((e) => e.columnType === _.USERID);
+	return t === -1 ? [] : e.queryResult.queryResults.rows.map((e) => e.values[t]).filter((e) => e !== null);
+}
+function w({ sql: n, count: r, useQueryResultUserData: i = !1, size: s = e, summaryLink: _, summaryLinkText: b, selectedFacets: w, searchParams: T, sqlOperator: E, additionalFiltersSessionStorageKey: D }) {
+	let { accessToken: O, keyFactory: k } = a(), A = `${y}-${n}-${JSON.stringify(w)}`, j = S(n, {
+		selectedFacets: w,
+		searchParams: T,
+		sqlOperator: E,
+		additionalFiltersSessionStorageKey: D
+	}), { data: M, isPending: N } = v({
+		...o,
+		queryKey: k.getFullTableQueryResultQueryKey(j, !1),
+		queryFn: () => t.getFullQueryTableResults(j, O)
+	}), [P, F] = m([]), I = f(() => C(M), [M]), L = I.slice(0, r), R = p(!1);
+	d(() => {
+		R.current || (R.current = !0, F(x(I, r, A)));
+	}, [
+		I,
+		r,
+		A
+	]);
+	let z = P.length > 0 ? P : L;
+	return /* @__PURE__ */ g("div", {
 		className: "UserCardListRotate",
 		children: [
-			A && /* @__PURE__ */ l(a, {}),
-			!A && E.length === 0 && /* @__PURE__ */ l("p", {
+			N && /* @__PURE__ */ h(c, {}),
+			!N && z.length === 0 && /* @__PURE__ */ h("p", {
 				className: "font-italic",
 				children: "No one was found."
 			}),
-			!A && E.length > 0 && /* @__PURE__ */ l(o, {
-				list: E,
-				size: v,
-				rowSet: O?.queryResult?.queryResults
+			!N && z.length > 0 && /* @__PURE__ */ h(l, {
+				list: z,
+				size: s,
+				rowSet: i ? M?.queryResult?.queryResults : void 0
 			}),
-			y && b && /* @__PURE__ */ l("div", {
+			_ && b && /* @__PURE__ */ h("div", {
 				className: "UserCardListRotate__summary",
-				children: /* @__PURE__ */ l(s, {
+				children: /* @__PURE__ */ h(u, {
 					color: "secondary",
 					variant: "contained",
-					href: y,
+					href: _,
 					children: b
 				})
 			})
 		]
 	});
 }
+async function T(e, n, r) {
+	let a = new i(void 0), c = S(n, r), l = a.getFullTableQueryResultQueryKey(c, !1);
+	await e.prefetchQuery({
+		...o,
+		queryKey: l,
+		queryFn: () => t.getFullQueryTableResults(c, void 0)
+	});
+	let u = C(e.getQueryData(l)).slice(0, r?.count ?? b);
+	u.length > 0 && await e.prefetchQuery(s(u, { keyFactory: a }));
+}
 //#endregion
-export { g as UserCardListRotate, g as default, h as getDisplayIds };
+export { w as UserCardListRotate, w as default, x as getDisplayIds, T as prefetchUserCardListRotate };
 
 //# sourceMappingURL=UserCardListRotate.js.map

package/dist/components/UserCardList/UserCardListRotate.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserCardListRotate.js","names":[],"sources":["../../../src/components/UserCardList/UserCardListRotate.tsx"],"sourcesContent":["import LargeButton from '@/components/styled/LargeButton'\nimport SynapseClient from '@/synapse-client'\nimport { SynapseConstants } from '@/utils'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport {\n  getAdditionalFilters,\n  parseEntityIdFromSqlStatement,\n  SQLOperator,\n} from '@/utils/functions/SqlFunctions'\nimport { LARGE_USER_CARD, UserCardSize } from '@/utils/SynapseConstants'\nimport {\n  ColumnTypeEnum,\n  FacetColumnRequest,\n  QueryBundleRequest,\n  QueryResultBundle,\n} from '@sage-bionetworks/synapse-types'\nimport { useState } from 'react'\nimport { useDeepCompareEffectNoCheck } from 'use-deep-compare-effect'\nimport { LoadingUserCardMedium } from '../UserCard/UserCardMedium'\nimport UserCardList from './UserCardList'\n\nconst STORED_UID_KEY = 'sage_rotate_uids'\nconst DEFAULT_DISPLAY_COUNT = 3\n\nexport type UserCardListRotateProps = {\n  sql: string\n  count: number\n  useQueryResultUserData?: boolean\n  size?: UserCardSize\n  summaryLink?: string\n  summaryLinkText?: string\n  selectedFacets?: FacetColumnRequest[]\n  sqlOperator?: SQLOperator\n  searchParams?: Record<string, string>\n  additionalFiltersSessionStorageKey?: string\n}\n\nexport const getDisplayIds = (\n  ids: string[] = [],\n  count: number = DEFAULT_DISPLAY_COUNT,\n  storageUidKey: string,\n) => {\n  let storedIds: string[] = []\n  let newIds: string[] = []\n  const storedIdsStr = localStorage.getItem(storageUidKey)\n  if (storedIdsStr != null) {\n    storedIds = JSON.parse(storedIdsStr)\n  }\n  if (!storedIds.length) {\n    // no stuff in storage\n    newIds = ids.slice(0, count)\n    localStorage.setItem(storageUidKey, JSON.stringify(newIds))\n    return newIds\n  } else {\n    // has stuff in storage\n    const filtered = ids.filter(item => !storedIds.includes(item))\n    if (filtered.length >= count) {\n      newIds = filtered.slice(0, count)\n      localStorage.setItem(\n        storageUidKey,\n        JSON.stringify(storedIds.concat(newIds)),\n      )\n      return newIds\n    } else {\n      localStorage.removeItem(storageUidKey)\n      const part = ids.slice(0, count - filtered.length)\n      localStorage.setItem(storageUidKey, JSON.stringify(part))\n      return filtered.concat(part)\n    }\n  }\n}\n\nexport function UserCardListRotate({\n  sql,\n  count,\n  useQueryResultUserData = false,\n  size = LARGE_USER_CARD,\n  summaryLink,\n  summaryLinkText,\n  selectedFacets,\n  searchParams,\n  sqlOperator,\n  additionalFiltersSessionStorageKey,\n}: UserCardListRotateProps) {\n  const { accessToken } = useSynapseContext()\n  const [userIds, setUserIds] = useState<string[]>([])\n  const [queryData, setQueryData] = useState<QueryResultBundle>()\n  const [isLoading, setIsLoading] = useState<boolean>()\n  let mounted = true\n  const storageUidKey = `${STORED_UID_KEY}-${sql}-${JSON.stringify(\n    selectedFacets,\n  )}`\n  useDeepCompareEffectNoCheck(() => {\n    const fetchData = async function () {\n      setIsLoading(true)\n      const entityId = parseEntityIdFromSqlStatement(sql)\n      const additionalFilters = getAdditionalFilters(\n        searchParams,\n        sqlOperator,\n        additionalFiltersSessionStorageKey,\n      )\n      const partMask = SynapseConstants.BUNDLE_MASK_QUERY_RESULTS\n      const request: QueryBundleRequest = {\n        partMask,\n        concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n        entityId,\n        query: {\n          sql,\n          additionalFilters,\n          selectedFacets,\n        },\n      }\n\n      const queryResultBundle = await SynapseClient.getFullQueryTableResults(\n        request,\n        accessToken,\n      )\n      const { queryResult } = queryResultBundle\n      if (queryResult?.queryResults.rows) {\n        // find the column that has the USER_ID in it.\n        const ownerIdColumnIndex = queryResult.queryResults.headers.findIndex(\n          el => el.columnType === ColumnTypeEnum.USERID,\n        )\n        const ids: string[] = queryResult.queryResults.rows\n          .map(d => d.values[ownerIdColumnIndex])\n          .filter((id): id is string => id !== null)\n        if (mounted) {\n          const newIds = getDisplayIds(ids, count, storageUidKey)\n          setUserIds(newIds)\n          if (useQueryResultUserData) {\n            setQueryData(queryResultBundle)\n          }\n          setIsLoading(false)\n        }\n      } else {\n        console.log('UserCardListRotate: Error getting data')\n      }\n    }\n    fetchData()\n\n    return () => {\n      mounted = false\n    }\n  }, [sql, selectedFacets, count, accessToken, searchParams, sqlOperator])\n\n  return (\n    <div className=\"UserCardListRotate\">\n      {isLoading && <LoadingUserCardMedium />}\n      {!isLoading && userIds.length === 0 && (\n        <p className=\"font-italic\">No one was found.</p>\n      )}\n      {!isLoading && userIds.length > 0 && (\n        <UserCardList\n          list={userIds}\n          size={size}\n          rowSet={queryData?.queryResult?.queryResults}\n        />\n      )}\n      {summaryLink && summaryLinkText && (\n        <div className=\"UserCardListRotate__summary\">\n          <LargeButton color=\"secondary\" variant=\"contained\" href={summaryLink}>\n            {summaryLinkText}\n          </LargeButton>\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport default UserCardListRotate\n"],"mappings":";;;;;;;;;;;;;AAqBA,IAAM,IAAiB,oBACjB,IAAwB,GAejB,KACX,IAAgB,CAAC,GACjB,IAAgB,GAChB,MACG;CACH,IAAI,IAAsB,CAAC,GACvB,IAAmB,CAAC,GAClB,IAAe,aAAa,QAAQ,CAAa;CAIvD,IAHI,KAAgB,SAClB,IAAY,KAAK,MAAM,CAAY,IAEhC,EAAU,QAKR;EAEL,IAAM,IAAW,EAAI,QAAO,MAAQ,CAAC,EAAU,SAAS,CAAI,CAAC;EAC7D,IAAI,EAAS,UAAU,GAMrB,OALA,IAAS,EAAS,MAAM,GAAG,CAAK,GAChC,aAAa,QACX,GACA,KAAK,UAAU,EAAU,OAAO,CAAM,CAAC,CACzC,GACO;EACF;GACL,aAAa,WAAW,CAAa;GACrC,IAAM,IAAO,EAAI,MAAM,GAAG,IAAQ,EAAS,MAAM;GAEjD,OADA,aAAa,QAAQ,GAAe,KAAK,UAAU,CAAI,CAAC,GACjD,EAAS,OAAO,CAAI;EAC7B;CACF,OAjBE,OAFA,IAAS,EAAI,MAAM,GAAG,CAAK,GAC3B,aAAa,QAAQ,GAAe,KAAK,UAAU,CAAM,CAAC,GACnD;AAkBX;AAEA,SAAgB,EAAmB,EACjC,QACA,UACA,4BAAyB,IACzB,UAAO,GACP,gBACA,oBACA,mBACA,iBACA,gBACA,yCAC0B;CAC1B,IAAM,EAAE,mBAAgB,EAAkB,GACpC,CAAC,GAAS,KAAc,EAAmB,CAAC,CAAC,GAC7C,CAAC,GAAW,KAAgB,EAA4B,GACxD,CAAC,GAAW,KAAgB,EAAkB,GAChD,IAAU,IACR,IAAgB,GAAG,EAAe,GAAG,EAAI,GAAG,KAAK,UACrD,CACF;CAsDA,OArDA,SA8CE,iBA7CoC;EAClC,EAAa,EAAI;EAQjB,IAAM,IAA8B;GAClC,UAAA;GACA,cAAc;GACd,UAVe,EAA8B,CAU7C;GACA,OAAO;IACL;IACA,mBAZsB,EACxB,GACA,GACA,CASE;IACA;GACF;EACF,GAEM,IAAoB,MAAM,EAAc,yBAC5C,GACA,CACF,GACM,EAAE,mBAAgB;EACxB,IAAI,GAAa,aAAa,MAAM;GAElC,IAAM,IAAqB,EAAY,aAAa,QAAQ,WAC1D,MAAM,EAAG,eAAe,EAAe,MACzC,GACM,IAAgB,EAAY,aAAa,KAC5C,KAAI,MAAK,EAAE,OAAO,EAAmB,EACrC,QAAQ,MAAqB,MAAO,IAAI;GAC3C,AAAI,MAEF,EADe,EAAc,GAAK,GAAO,CAC9B,CAAM,GACb,KACF,EAAa,CAAiB,GAEhC,EAAa,EAAK;EAEtB,OACE,QAAQ,IAAI,wCAAwC;CAExD,EACU,SAEG;EACX,IAAU;CACZ,IACC;EAAC;EAAK;EAAgB;EAAO;EAAa;EAAc;CAAW,CAAC,GAGrE,kBAAC,OAAD;EAAK,WAAU;YAAf;GACG,KAAa,kBAAC,GAAD,CAAwB,CAAA;GACrC,CAAC,KAAa,EAAQ,WAAW,KAChC,kBAAC,KAAD;IAAG,WAAU;cAAc;GAAoB,CAAA;GAEhD,CAAC,KAAa,EAAQ,SAAS,KAC9B,kBAAC,GAAD;IACE,MAAM;IACA;IACN,QAAQ,GAAW,aAAa;GACjC,CAAA;GAEF,KAAe,KACd,kBAAC,OAAD;IAAK,WAAU;cACb,kBAAC,GAAD;KAAa,OAAM;KAAY,SAAQ;KAAY,MAAM;eACtD;IACU,CAAA;GACV,CAAA;EAEJ;;AAET"}
+{"version":3,"file":"UserCardListRotate.js","names":[],"sources":["../../../src/components/UserCardList/UserCardListRotate.tsx"],"sourcesContent":["import LargeButton from '@/components/styled/LargeButton'\nimport SynapseClient from '@/synapse-client'\nimport { KeyFactory } from '@/synapse-queries/KeyFactory'\nimport { tableQueryUseQueryDefaults } from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { getUserProfilesWithProfilePicAttachedQueryOptions } from '@/synapse-queries/user/useUserBundle'\nimport { SynapseConstants } from '@/utils'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport {\n  getAdditionalFilters,\n  parseEntityIdFromSqlStatement,\n  SQLOperator,\n} from '@/utils/functions/SqlFunctions'\nimport { LARGE_USER_CARD, UserCardSize } from '@/utils/SynapseConstants'\nimport {\n  ColumnTypeEnum,\n  FacetColumnRequest,\n  QueryBundleRequest,\n  QueryResultBundle,\n} from '@sage-bionetworks/synapse-types'\nimport { QueryClient, useQuery } from '@tanstack/react-query'\nimport { useEffect, useMemo, useRef, useState } from 'react'\nimport { LoadingUserCardMedium } from '../UserCard/UserCardMedium'\nimport UserCardList from './UserCardList'\n\nconst STORED_UID_KEY = 'sage_rotate_uids'\nconst DEFAULT_DISPLAY_COUNT = 3\n\nexport type UserCardListRotateProps = {\n  sql: string\n  count: number\n  useQueryResultUserData?: boolean\n  size?: UserCardSize\n  summaryLink?: string\n  summaryLinkText?: string\n  selectedFacets?: FacetColumnRequest[]\n  sqlOperator?: SQLOperator\n  searchParams?: Record<string, string>\n  additionalFiltersSessionStorageKey?: string\n}\n\nexport const getDisplayIds = (\n  ids: string[] = [],\n  count: number = DEFAULT_DISPLAY_COUNT,\n  storageUidKey: string,\n): string[] => {\n  // Guard against SSR / Node.js environments where localStorage is unavailable\n  if (typeof localStorage === 'undefined') {\n    return ids.slice(0, count)\n  }\n  const storedIdsJson = localStorage.getItem(storageUidKey)\n  const seenIds: string[] = storedIdsJson\n    ? (JSON.parse(storedIdsJson) as string[])\n    : []\n\n  if (!seenIds.length) {\n    const selected = ids.slice(0, count)\n    localStorage.setItem(storageUidKey, JSON.stringify(selected))\n    return selected\n  }\n\n  const seenSet = new Set(seenIds)\n  const unseenIds = ids.filter(id => !seenSet.has(id))\n\n  if (unseenIds.length >= count) {\n    const selected = unseenIds.slice(0, count)\n    localStorage.setItem(\n      storageUidKey,\n      JSON.stringify([...seenIds, ...selected]),\n    )\n    return selected\n  }\n\n  // Not enough unseen IDs — reset and cycle back to the beginning\n  const fromStart = ids.slice(0, count - unseenIds.length)\n  localStorage.setItem(storageUidKey, JSON.stringify(fromStart))\n  return [...unseenIds, ...fromStart]\n}\n\nfunction buildRequest(\n  sql: string,\n  options?: {\n    selectedFacets?: FacetColumnRequest[]\n    searchParams?: Record<string, string>\n    sqlOperator?: SQLOperator\n    additionalFiltersSessionStorageKey?: string\n  },\n): QueryBundleRequest {\n  const entityId = parseEntityIdFromSqlStatement(sql)\n  const additionalFilters = getAdditionalFilters(\n    options?.searchParams,\n    options?.sqlOperator,\n    options?.additionalFiltersSessionStorageKey,\n  )\n  return {\n    partMask: SynapseConstants.BUNDLE_MASK_QUERY_RESULTS,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    entityId,\n    query: {\n      sql,\n      additionalFilters,\n      selectedFacets: options?.selectedFacets,\n    },\n  }\n}\n\nfunction extractUserIdsFromBundle(\n  bundle: QueryResultBundle | undefined,\n): string[] {\n  if (!bundle?.queryResult?.queryResults.rows) return []\n  const ownerIdColumnIndex = bundle.queryResult.queryResults.headers.findIndex(\n    el => el.columnType === ColumnTypeEnum.USERID,\n  )\n  if (ownerIdColumnIndex === -1) return []\n  return bundle.queryResult.queryResults.rows\n    .map(d => d.values[ownerIdColumnIndex])\n    .filter((id): id is string => id !== null)\n}\n\nexport function UserCardListRotate({\n  sql,\n  count,\n  useQueryResultUserData = false,\n  size = LARGE_USER_CARD,\n  summaryLink,\n  summaryLinkText,\n  selectedFacets,\n  searchParams,\n  sqlOperator,\n  additionalFiltersSessionStorageKey,\n}: UserCardListRotateProps) {\n  const { accessToken, keyFactory } = useSynapseContext()\n  const storageUidKey = `${STORED_UID_KEY}-${sql}-${JSON.stringify(\n    selectedFacets,\n  )}`\n\n  const request = buildRequest(sql, {\n    selectedFacets,\n    searchParams,\n    sqlOperator,\n    additionalFiltersSessionStorageKey,\n  })\n\n  const { data: queryResultBundle, isPending } = useQuery({\n    ...tableQueryUseQueryDefaults,\n    queryKey: keyFactory.getFullTableQueryResultQueryKey(request, false),\n    queryFn: () => SynapseClient.getFullQueryTableResults(request, accessToken),\n  })\n\n  const [rotatedShownIds, setRotatedShownIds] = useState<string[]>([])\n  const allIds = useMemo(\n    () => extractUserIdsFromBundle(queryResultBundle),\n    [queryResultBundle],\n  )\n\n  const firstNIds = allIds.slice(0, count)\n\n  // Not ideal to use an effect, but this ensures this is isomorphic for SSG\n  // while ensuring a new set of IDs is shown after client rendering takes over.\n  const hasMounted = useRef(false)\n  useEffect(() => {\n    if (!hasMounted.current) {\n      hasMounted.current = true\n      setRotatedShownIds(getDisplayIds(allIds, count, storageUidKey))\n    }\n  }, [allIds, count, storageUidKey])\n\n  const renderedIds = rotatedShownIds.length > 0 ? rotatedShownIds : firstNIds\n\n  return (\n    <div className=\"UserCardListRotate\">\n      {isPending && <LoadingUserCardMedium />}\n      {!isPending && renderedIds.length === 0 && (\n        <p className=\"font-italic\">No one was found.</p>\n      )}\n      {!isPending && renderedIds.length > 0 && (\n        <UserCardList\n          list={renderedIds}\n          size={size}\n          rowSet={\n            useQueryResultUserData\n              ? queryResultBundle?.queryResult?.queryResults\n              : undefined\n          }\n        />\n      )}\n      {summaryLink && summaryLinkText && (\n        <div className=\"UserCardListRotate__summary\">\n          <LargeButton color=\"secondary\" variant=\"contained\" href={summaryLink}>\n            {summaryLinkText}\n          </LargeButton>\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport default UserCardListRotate\n\n/**\n * Prefetches the UserCardListRotate table query and the user profiles it\n * references into a QueryClient for use with HydrationBoundary. Uses anonymous\n * access; warm-caches for unauthenticated users.\n */\nexport async function prefetchUserCardListRotate(\n  queryClient: QueryClient,\n  sql: string,\n  options?: {\n    selectedFacets?: FacetColumnRequest[]\n    searchParams?: Record<string, string>\n    sqlOperator?: SQLOperator\n    additionalFiltersSessionStorageKey?: string\n    count?: number\n  },\n): Promise<void> {\n  const keyFactory = new KeyFactory(undefined)\n  const request = buildRequest(sql, options)\n  const queryKey = keyFactory.getFullTableQueryResultQueryKey(request, false)\n  await queryClient.prefetchQuery({\n    ...tableQueryUseQueryDefaults,\n    queryKey,\n    queryFn: () => SynapseClient.getFullQueryTableResults(request, undefined),\n  })\n\n  const queryResultBundle =\n    queryClient.getQueryData<QueryResultBundle>(queryKey)\n  // During SSR localStorage is unavailable, so getDisplayIds falls back to\n  // slice(0, count). Match that here so prefetched profiles cover exactly the\n  // IDs the first render will request.\n  const principalIds = extractUserIdsFromBundle(queryResultBundle).slice(\n    0,\n    options?.count ?? DEFAULT_DISPLAY_COUNT,\n  )\n  if (principalIds.length > 0) {\n    await queryClient.prefetchQuery(\n      getUserProfilesWithProfilePicAttachedQueryOptions(principalIds, {\n        keyFactory,\n      }),\n    )\n  }\n}\n"],"mappings":"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"}

package/dist/style/abstracts/_cssVariables.scss

@@ -88,6 +88,7 @@
 
   // Primary / Secondary / Tertiary Action Colors
   --synapse-primary-action-color: #{v.$primary-action-color};
+  --synapse-focus-color: var(--synapse-primary-action-color);
   --synapse-primary-bgcolor-rgba: #{v.$primary-bgcolor-rgba};
   --synapse-secondary-action-color: #{v.$secondary-action-color};
   --synapse-tertiary-action-color: #{v.$tertiary-action-color};