synapse-react-client 4.0.9 → 4.0.11

package/dist/components/UserProfileLinks/UserProjects.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserProjects.js","names":[],"sources":["../../../src/components/UserProfileLinks/UserProjects.tsx"],"sourcesContent":["import { useGetUserProjectsInfinite } from '@/synapse-queries/user/useGetUserProjects'\nimport { PRODUCTION_ENDPOINT_CONFIG } from '@/utils/functions/getEndpoint'\nimport {\n  GetProjectsParameters,\n  ProjectHeader,\n} from '@sage-bionetworks/synapse-types'\nimport { useEffect } from 'react'\nimport { useErrorHandler } from 'react-error-boundary'\nimport { useInView } from 'react-intersection-observer'\nimport { SkeletonTable } from '../Skeleton/SkeletonTable'\n\nexport type UserProjectsProps = {\n  userId: string\n}\n\nexport default function UserProjects({ userId }: UserProjectsProps) {\n  const handleError = useErrorHandler()\n  // Load the next page when this ref comes into view.\n  const { ref, inView } = useInView()\n  const getProjectsParameters: GetProjectsParameters = {}\n  const {\n    data,\n    status,\n    isFetching,\n    isLoading,\n    hasNextPage,\n    fetchNextPage,\n    isError,\n    error: newError,\n  } = useGetUserProjectsInfinite(userId, getProjectsParameters)\n\n  useEffect(() => {\n    if (isError && newError) {\n      handleError(newError)\n    }\n  }, [isError, newError, handleError])\n\n  useEffect(() => {\n    if (\n      status === 'success' &&\n      !isFetching &&\n      hasNextPage &&\n      fetchNextPage &&\n      inView\n    ) {\n      fetchNextPage()\n    }\n  }, [status, isFetching, hasNextPage, fetchNextPage, inView])\n\n  const allRows = data?.pages.flatMap(page => page.results) ?? []\n\n  return (\n    <>\n      {allRows.length > 0 && (\n        <>\n          {allRows.map((item: ProjectHeader) => {\n            if (item) {\n              // another option would be to use an EntityLink\n              return (\n                <p key={`user-project-list-item-${item.id}`}>\n                  <a\n                    target=\"_self\"\n                    rel=\"noopener noreferrer\"\n                    href={`${PRODUCTION_ENDPOINT_CONFIG.PORTAL}Synapse:${item.id}`}\n                  >\n                    {item.name}\n                  </a>\n                </p>\n              )\n            } else return false\n          })}\n          {/* To trigger loading the next page */}\n          <div ref={ref} />\n        </>\n      )}\n      {!isFetching && allRows.length == 0 && <div>Empty</div>}\n      {isLoading && <SkeletonTable numRows={5} numCols={1} />}\n    </>\n  )\n}\n"],"mappings":";;;;;;;;AAeA,SAAwB,EAAa,EAAE,aAA6B;CAClE,IAAM,IAAc,GAAiB,EAE/B,EAAE,QAAK,cAAW,GAAW,EAE7B,EACJ,SACA,WACA,eACA,cACA,gBACA,kBACA,YACA,OAAO,MACL,EAA2B,GAVsB,EAAE,CAUM;AAQ7D,CANA,QAAgB;AACd,EAAI,KAAW,KACb,EAAY,EAAS;IAEtB;EAAC;EAAS;EAAU;EAAY,CAAC,EAEpC,QAAgB;AACd,EACE,MAAW,aACX,CAAC,KACD,KACA,KACA,KAEA,GAAe;IAEhB;EAAC;EAAQ;EAAY;EAAa;EAAe;EAAO,CAAC;CAE5D,IAAM,IAAU,GAAM,MAAM,SAAQ,MAAQ,EAAK,QAAQ,IAAI,EAAE;AAE/D,QACE,kBAAA,GAAA,EAAA,UAAA;EACG,EAAQ,SAAS,KAChB,kBAAA,GAAA,EAAA,UAAA,CACG,EAAQ,KAAK,MACR,IAGA,kBAAC,KAAD,EAAA,UACE,kBAAC,KAAD;GACE,QAAO;GACP,KAAI;GACJ,MAAM,GAAG,EAA2B,OAAO,UAAU,EAAK;aAEzD,EAAK;GACJ,CAAA,EACF,EARI,0BAA0B,EAAK,KAQnC,GAEM,GACd,EAEF,kBAAC,OAAD,EAAU,QAAO,CAAA,CAChB,EAAA,CAAA;EAEJ,CAAC,KAAc,EAAQ,UAAU,KAAK,kBAAC,OAAD,EAAA,UAAK,SAAW,CAAA;EACtD,KAAa,kBAAC,GAAD;GAAe,SAAS;GAAG,SAAS;GAAK,CAAA;EACtD,EAAA,CAAA"}
+{"version":3,"file":"UserProjects.js","names":[],"sources":["../../../src/components/UserProfileLinks/UserProjects.tsx"],"sourcesContent":["import { useGetUserProjectsInfinite } from '@/synapse-queries/user/useGetUserProjects'\nimport { PRODUCTION_ENDPOINT_CONFIG } from '@/utils/functions/getEndpoint'\nimport {\n  GetProjectsParameters,\n  ProjectHeader,\n} from '@sage-bionetworks/synapse-types'\nimport { useEffect } from 'react'\nimport { useErrorHandler } from 'react-error-boundary'\nimport { useInView } from 'react-intersection-observer'\nimport { SkeletonTable } from '../Skeleton/SkeletonTable'\n\nexport type UserProjectsProps = {\n  userId: string\n}\n\nexport default function UserProjects({ userId }: UserProjectsProps) {\n  const handleError = useErrorHandler()\n  // Load the next page when this ref comes into view.\n  const { ref, inView } = useInView()\n  const getProjectsParameters: GetProjectsParameters = {}\n  const {\n    data,\n    status,\n    isFetching,\n    isLoading,\n    hasNextPage,\n    fetchNextPage,\n    isError,\n    error: newError,\n  } = useGetUserProjectsInfinite(userId, getProjectsParameters)\n\n  useEffect(() => {\n    if (isError && newError) {\n      handleError(newError)\n    }\n  }, [isError, newError, handleError])\n\n  useEffect(() => {\n    if (\n      status === 'success' &&\n      !isFetching &&\n      hasNextPage &&\n      fetchNextPage &&\n      inView\n    ) {\n      fetchNextPage()\n    }\n  }, [status, isFetching, hasNextPage, fetchNextPage, inView])\n\n  const allRows = data?.pages.flatMap(page => page.results) ?? []\n\n  return (\n    <>\n      {allRows.length > 0 && (\n        <>\n          {allRows.map((item: ProjectHeader) => {\n            if (item) {\n              // another option would be to use an EntityLink\n              return (\n                <p key={`user-project-list-item-${item.id}`}>\n                  <a\n                    target=\"_self\"\n                    rel=\"noopener noreferrer\"\n                    href={`${PRODUCTION_ENDPOINT_CONFIG.PORTAL}Synapse:${item.id}`}\n                  >\n                    {item.name}\n                  </a>\n                </p>\n              )\n            } else return false\n          })}\n          {/* To trigger loading the next page */}\n          <div ref={ref} />\n        </>\n      )}\n      {!isFetching && allRows.length == 0 && <div>Empty</div>}\n      {isLoading && <SkeletonTable numRows={5} numCols={1} />}\n    </>\n  )\n}\n"],"mappings":";;;;;;;;AAeA,SAAwB,EAAa,EAAE,aAA6B;CAClE,IAAM,IAAc,GAAiB,EAE/B,EAAE,QAAK,cAAW,GAAW,EAE7B,EACJ,SACA,WACA,eACA,cACA,gBACA,kBACA,YACA,OAAO,MACL,EAA2B,GAAQ,EAAA,CAAsB;AAQ7D,CANA,QAAgB;AACd,EAAI,KAAW,KACb,EAAY,EAAS;IAEtB;EAAC;EAAS;EAAU;EAAY,CAAC,EAEpC,QAAgB;AACd,EACE,MAAW,aACX,CAAC,KACD,KACA,KACA,KAEA,GAAe;IAEhB;EAAC;EAAQ;EAAY;EAAa;EAAe;EAAO,CAAC;CAE5D,IAAM,IAAU,GAAM,MAAM,SAAQ,MAAQ,EAAK,QAAQ,IAAI,EAAE;AAE/D,QACE,kBAAA,GAAA,EAAA,UAAA;EACG,EAAQ,SAAS,KAChB,kBAAA,GAAA,EAAA,UAAA,CACG,EAAQ,KAAK,MACR,IAGA,kBAAC,KAAD,EAAA,UACE,kBAAC,KAAD;GACE,QAAO;GACP,KAAI;GACJ,MAAM,GAAG,EAA2B,OAAO,UAAU,EAAK;aAEzD,EAAK;GACJ,CAAA,EACF,EARI,0BAA0B,EAAK,KAQnC,GAEM,GACd,EAEF,kBAAC,OAAD,EAAU,QAAO,CAAA,CAChB,EAAA,CAAA;EAEJ,CAAC,KAAc,EAAQ,UAAU,KAAK,kBAAC,OAAD,EAAA,UAAK,SAAW,CAAA;EACtD,KAAa,kBAAC,GAAD;GAAe,SAAS;GAAG,SAAS;GAAK,CAAA;EACtD,EAAA,CAAA"}

package/dist/components/UserSearchBox/UserSearchBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserSearchBox.js","names":[],"sources":["../../../src/components/UserSearchBox/UserSearchBox.tsx"],"sourcesContent":["import {\n  useGetUserGroupHeader,\n  useSearchUserGroupHeaders,\n} from '@/synapse-queries'\nimport { useDebouncedEffect } from '@/utils/hooks/useDebouncedEffect'\nimport { Autocomplete, Box, Skeleton, TextField } from '@mui/material'\nimport { TYPE_FILTER, UserGroupHeader } from '@sage-bionetworks/synapse-types'\nimport { useMemo, useState } from 'react'\nimport UserOrTeamBadge from '../UserOrTeamBadge/UserOrTeamBadge'\n\nexport type UserSearchBoxProps = {\n  /* id for the input element, for associating with a <label> */\n  inputId?: string\n  /* The initial principal ID (uncontrolled). Ignored if `value` is provided. */\n  defaultValue?: string\n  onChange?: (\n    principalId: string | null,\n    header: UserGroupHeader | null,\n  ) => void\n  typeFilter?: TYPE_FILTER\n  filterPredicate?: (item: UserGroupHeader) => boolean\n  placeholder?: string\n  autoFocus?: boolean\n  /**\n   * The principal ID of the currently selected user or team.\n   * - `undefined`: uncontrolled — the component manages its own selection state\n   * - `null`: controlled with no selection (clears the field)\n   * - string: controlled with the given principal ID selected\n   */\n  value?: string | null\n}\n\n/**\n * Autocomplete component used to search for and select a user or team.\n */\nfunction UserSearchBox(props: UserSearchBoxProps) {\n  const {\n    inputId,\n    defaultValue = null,\n    onChange,\n    filterPredicate,\n    typeFilter,\n    placeholder,\n    autoFocus = false,\n    value: valueProp,\n  } = props\n\n  const isControlled = valueProp !== undefined\n\n  const [inputValue, setInputValue] = useState('')\n  const [debouncedInput, setDebouncedInput] = useState('')\n  useDebouncedEffect(\n    () => {\n      setDebouncedInput(inputValue)\n    },\n    [inputValue],\n    500,\n  )\n\n  // Tracks whether the dropdown is open, used to toggle between badge display\n  // and text-input search mode.\n  const [isSearching, setIsSearching] = useState(false)\n\n  // Resolve defaultValue principalId → UserGroupHeader for the initial uncontrolled state\n  const { data: defaultUserGroupHeader, isLoading: isLoadingDefaultValue } =\n    useGetUserGroupHeader(defaultValue ?? '', {\n      enabled: !!defaultValue && !isControlled,\n    })\n\n  // Resolve controlled string principalId → UserGroupHeader\n  const controlledPrincipalId =\n    isControlled && typeof valueProp === 'string' ? valueProp : null\n\n  const {\n    data: resolvedControlledHeader,\n    isLoading: isLoadingControlledValue,\n  } = useGetUserGroupHeader(controlledPrincipalId ?? '', {\n    enabled: !!controlledPrincipalId,\n  })\n\n  // Internal state for uncontrolled mode.\n  // undefined = user hasn't interacted yet → falls back to defaultUserGroupHeader\n  // null      = user explicitly cleared the selection\n  // header    = user's current selection\n  const [internalValue, setInternalValue] = useState<\n    UserGroupHeader | null | undefined\n  >(undefined)\n\n  const controlledValue =\n    typeof valueProp === 'string' ? resolvedControlledHeader ?? null : null\n  const uncontrolledValue =\n    internalValue !== undefined ? internalValue : defaultUserGroupHeader ?? null\n  const resolvedValue: UserGroupHeader | null = isControlled\n    ? controlledValue\n    : uncontrolledValue\n\n  // Show the badge in the input field when a value is selected and the user\n  // is not actively searching.\n  const showBadge = resolvedValue !== null && !isSearching\n\n  const isSearchEnabled = !!debouncedInput\n  const { data, isLoading } = useSearchUserGroupHeaders(\n    debouncedInput,\n    typeFilter,\n    {\n      enabled: isSearchEnabled,\n    },\n  )\n\n  const options = useMemo(\n    () => (data ?? []).filter(filterPredicate ?? (() => true)),\n    [data, filterPredicate],\n  )\n\n  const placeholderText = useMemo(() => {\n    if (placeholder !== undefined) {\n      return placeholder\n    } else if (typeFilter == TYPE_FILTER.USERS_ONLY) {\n      return 'Name (first and last)'\n    } else if (typeFilter == TYPE_FILTER.TEAMS_ONLY) {\n      return 'Team name'\n    } else {\n      return 'Name (first and last) or team name'\n    }\n  }, [placeholder, typeFilter])\n\n  if (isLoadingDefaultValue || isLoadingControlledValue) {\n    return <Skeleton width=\"100%\" />\n  }\n\n  return (\n    <Autocomplete<UserGroupHeader, false, false, false>\n      id={inputId}\n      value={resolvedValue}\n      inputValue={inputValue}\n      onInputChange={(_event, newInputValue, reason) => {\n        if (reason === 'selectOption' || reason === 'reset') {\n          // After an option is selected/removed, clear the input text so it's ready for the next search.\n          setInputValue('')\n        } else {\n          setInputValue(newInputValue)\n        }\n      }}\n      // When a value is selected, clicking the badge area should re-open the search.\n      openOnFocus={resolvedValue !== null}\n      onOpen={() => {\n        setIsSearching(true)\n      }}\n      onClose={() => setIsSearching(false)}\n      options={options}\n      filterOptions={x => x}\n      loading={isLoading || inputValue !== debouncedInput}\n      isOptionEqualToValue={(option, val) => option.ownerId === val.ownerId}\n      getOptionLabel={option => option.userName}\n      renderOption={(optionProps, option) => (\n        <li {...optionProps} key={option.ownerId}>\n          <UserOrTeamBadge\n            userGroupHeader={option}\n            disableHref\n            showFullName\n            showCardOnHover={false}\n          />\n        </li>\n      )}\n      renderInput={({\n        inputProps: inputPropsFromParams,\n        InputProps: InputPropsFromParams,\n        ...params\n      }) => (\n        <TextField\n          {...params}\n          placeholder={showBadge ? undefined : placeholderText}\n          autoFocus={autoFocus}\n          slotProps={{\n            htmlInput: {\n              ...inputPropsFromParams,\n              // While the badge is displayed, hide the underlying input text and cursor.\n              // Merge custom styles with parent styles to preserve mouse selection and other behaviors.\n              style: {\n                ...inputPropsFromParams.style,\n                ...(showBadge ? { color: 'transparent' } : {}),\n              },\n            },\n            input: {\n              ...InputPropsFromParams,\n              startAdornment: showBadge ? (\n                <Box sx={{ ml: 1 }}>\n                  <UserOrTeamBadge\n                    userGroupHeader={resolvedValue}\n                    disableHref\n                    showFullName\n                    showCardOnHover={false}\n                  />\n                </Box>\n              ) : undefined,\n            },\n          }}\n        />\n      )}\n      onChange={(_event, newValue) => {\n        if (!isControlled) {\n          setInternalValue(newValue)\n        }\n        onChange?.(\n          newValue?.ownerId != null ? newValue.ownerId.toString() : null,\n          newValue ?? null,\n        )\n      }}\n      noOptionsText={\n        isLoading || inputValue !== debouncedInput ? 'Loading…' : 'No options'\n      }\n      clearOnEscape\n    />\n  )\n}\n\nexport default UserSearchBox\n"],"mappings":";;;;;;;;;AAmCA,SAAS,EAAc,GAA2B;CAChD,IAAM,EACJ,YACA,kBAAe,MACf,aACA,oBACA,eACA,gBACA,eAAY,IACZ,OAAO,MACL,GAEE,IAAe,MAAc,KAAA,GAE7B,CAAC,GAAY,KAAiB,EAAS,GAAG,EAC1C,CAAC,GAAgB,KAAqB,EAAS,GAAG;AACxD,SACQ;AACJ,IAAkB,EAAW;IAE/B,CAAC,EAAW,EACZ,IACD;CAID,IAAM,CAAC,GAAa,KAAkB,EAAS,GAAM,EAG/C,EAAE,MAAM,GAAwB,WAAW,MAC/C,EAAsB,KAAgB,IAAI,EACxC,SAAS,CAAC,CAAC,KAAgB,CAAC,GAC7B,CAAC,EAGE,IACJ,KAAgB,OAAO,KAAc,WAAW,IAAY,MAExD,EACJ,MAAM,GACN,WAAW,MACT,EAAsB,KAAyB,IAAI,EACrD,SAAS,CAAC,CAAC,GACZ,CAAC,EAMI,CAAC,GAAe,KAAoB,EAExC,KAAA,EAAU,EAMN,IAAwC,IAH5C,OAAO,KAAc,WAAW,KAA4B,OAAO,OAEnE,MAAkB,KAAA,IAA4B,KAA0B,OAA1C,GAO1B,IAAY,MAAkB,QAAQ,CAAC,GAGvC,EAAE,SAAM,iBAAc,EAC1B,GACA,GACA,EACE,SALoB,CAAC,CAAC,GAMvB,CACF,EAEK,IAAU,SACP,KAAQ,EAAE,EAAE,OAAO,YAA0B,IAAM,EAC1D,CAAC,GAAM,EAAgB,CACxB,EAEK,IAAkB,QAClB,MAAgB,KAAA,IAET,KAAc,EAAY,aAC5B,0BACE,KAAc,EAAY,aAC5B,cAEA,uCANA,GAQR,CAAC,GAAa,EAAW,CAAC;AAM7B,QAJI,KAAyB,IACpB,kBAAC,GAAD,EAAU,OAAM,QAAS,CAAA,GAIhC,kBAAC,GAAD;EACE,IAAI;EACJ,OAAO;EACK;EACZ,gBAAgB,GAAQ,GAAe,MAAW;AAChD,GAEE,EAFE,MAAW,kBAAkB,MAAW,UAE5B,KAEA,EAAc;;EAIhC,aAAa,MAAkB;EAC/B,cAAc;AACZ,KAAe,GAAK;;EAEtB,eAAe,EAAe,GAAM;EAC3B;EACT,gBAAe,MAAK;EACpB,SAAS,KAAa,MAAe;EACrC,uBAAuB,GAAQ,MAAQ,EAAO,YAAY,EAAI;EAC9D,iBAAgB,MAAU,EAAO;EACjC,eAAe,GAAa,MAC1B,kBAAC,MAAD;GAAI,GAAI;GAAa,KAAK,EAAO;GAO5B,EANH,kBAAC,GAAD;GACE,iBAAiB;GACjB,aAAA;GACA,cAAA;GACA,iBAAiB;GACjB,CAAA,CACC;EAEP,cAAc,EACZ,YAAY,GACZ,YAAY,GACZ,GAAG,QAEH,kBAAC,GAAD;GACE,GAAI;GACJ,aAAa,IAAY,KAAA,IAAY;GAC1B;GACX,WAAW;IACT,WAAW;KACT,GAAG;KAGH,OAAO;MACL,GAAG,EAAqB;MACxB,GAAI,IAAY,EAAE,OAAO,eAAe,GAAG,EAAE;MAC9C;KACF;IACD,OAAO;KACL,GAAG;KACH,gBAAgB,IACd,kBAAC,GAAD;MAAK,IAAI,EAAE,IAAI,GAAG;gBAChB,kBAAC,GAAD;OACE,iBAAiB;OACjB,aAAA;OACA,cAAA;OACA,iBAAiB;OACjB,CAAA;MACE,CAAA,GACJ,KAAA;KACL;IACF;GACD,CAAA;EAEJ,WAAW,GAAQ,MAAa;AAI9B,GAHK,KACH,EAAiB,EAAS,EAE5B,IACE,GAAU,WAAW,OAAqC,OAA9B,EAAS,QAAQ,UAAU,EACvD,KAAY,KACb;;EAEH,eACE,KAAa,MAAe,IAAiB,aAAa;EAE5D,eAAA;EACA,CAAA"}
+{"version":3,"file":"UserSearchBox.js","names":[],"sources":["../../../src/components/UserSearchBox/UserSearchBox.tsx"],"sourcesContent":["import {\n  useGetUserGroupHeader,\n  useSearchUserGroupHeaders,\n} from '@/synapse-queries'\nimport { useDebouncedEffect } from '@/utils/hooks/useDebouncedEffect'\nimport { Autocomplete, Box, Skeleton, TextField } from '@mui/material'\nimport { TYPE_FILTER, UserGroupHeader } from '@sage-bionetworks/synapse-types'\nimport { useMemo, useState } from 'react'\nimport UserOrTeamBadge from '../UserOrTeamBadge/UserOrTeamBadge'\n\nexport type UserSearchBoxProps = {\n  /* id for the input element, for associating with a <label> */\n  inputId?: string\n  /* The initial principal ID (uncontrolled). Ignored if `value` is provided. */\n  defaultValue?: string\n  onChange?: (\n    principalId: string | null,\n    header: UserGroupHeader | null,\n  ) => void\n  typeFilter?: TYPE_FILTER\n  filterPredicate?: (item: UserGroupHeader) => boolean\n  placeholder?: string\n  autoFocus?: boolean\n  /**\n   * The principal ID of the currently selected user or team.\n   * - `undefined`: uncontrolled — the component manages its own selection state\n   * - `null`: controlled with no selection (clears the field)\n   * - string: controlled with the given principal ID selected\n   */\n  value?: string | null\n}\n\n/**\n * Autocomplete component used to search for and select a user or team.\n */\nfunction UserSearchBox(props: UserSearchBoxProps) {\n  const {\n    inputId,\n    defaultValue = null,\n    onChange,\n    filterPredicate,\n    typeFilter,\n    placeholder,\n    autoFocus = false,\n    value: valueProp,\n  } = props\n\n  const isControlled = valueProp !== undefined\n\n  const [inputValue, setInputValue] = useState('')\n  const [debouncedInput, setDebouncedInput] = useState('')\n  useDebouncedEffect(\n    () => {\n      setDebouncedInput(inputValue)\n    },\n    [inputValue],\n    500,\n  )\n\n  // Tracks whether the dropdown is open, used to toggle between badge display\n  // and text-input search mode.\n  const [isSearching, setIsSearching] = useState(false)\n\n  // Resolve defaultValue principalId → UserGroupHeader for the initial uncontrolled state\n  const { data: defaultUserGroupHeader, isLoading: isLoadingDefaultValue } =\n    useGetUserGroupHeader(defaultValue ?? '', {\n      enabled: !!defaultValue && !isControlled,\n    })\n\n  // Resolve controlled string principalId → UserGroupHeader\n  const controlledPrincipalId =\n    isControlled && typeof valueProp === 'string' ? valueProp : null\n\n  const {\n    data: resolvedControlledHeader,\n    isLoading: isLoadingControlledValue,\n  } = useGetUserGroupHeader(controlledPrincipalId ?? '', {\n    enabled: !!controlledPrincipalId,\n  })\n\n  // Internal state for uncontrolled mode.\n  // undefined = user hasn't interacted yet → falls back to defaultUserGroupHeader\n  // null      = user explicitly cleared the selection\n  // header    = user's current selection\n  const [internalValue, setInternalValue] = useState<\n    UserGroupHeader | null | undefined\n  >(undefined)\n\n  const controlledValue =\n    typeof valueProp === 'string' ? resolvedControlledHeader ?? null : null\n  const uncontrolledValue =\n    internalValue !== undefined ? internalValue : defaultUserGroupHeader ?? null\n  const resolvedValue: UserGroupHeader | null = isControlled\n    ? controlledValue\n    : uncontrolledValue\n\n  // Show the badge in the input field when a value is selected and the user\n  // is not actively searching.\n  const showBadge = resolvedValue !== null && !isSearching\n\n  const isSearchEnabled = !!debouncedInput\n  const { data, isLoading } = useSearchUserGroupHeaders(\n    debouncedInput,\n    typeFilter,\n    {\n      enabled: isSearchEnabled,\n    },\n  )\n\n  const options = useMemo(\n    () => (data ?? []).filter(filterPredicate ?? (() => true)),\n    [data, filterPredicate],\n  )\n\n  const placeholderText = useMemo(() => {\n    if (placeholder !== undefined) {\n      return placeholder\n    } else if (typeFilter == TYPE_FILTER.USERS_ONLY) {\n      return 'Name (first and last)'\n    } else if (typeFilter == TYPE_FILTER.TEAMS_ONLY) {\n      return 'Team name'\n    } else {\n      return 'Name (first and last) or team name'\n    }\n  }, [placeholder, typeFilter])\n\n  if (isLoadingDefaultValue || isLoadingControlledValue) {\n    return <Skeleton width=\"100%\" />\n  }\n\n  return (\n    <Autocomplete<UserGroupHeader, false, false, false>\n      id={inputId}\n      value={resolvedValue}\n      inputValue={inputValue}\n      onInputChange={(_event, newInputValue, reason) => {\n        if (reason === 'selectOption' || reason === 'reset') {\n          // After an option is selected/removed, clear the input text so it's ready for the next search.\n          setInputValue('')\n        } else {\n          setInputValue(newInputValue)\n        }\n      }}\n      // When a value is selected, clicking the badge area should re-open the search.\n      openOnFocus={resolvedValue !== null}\n      onOpen={() => {\n        setIsSearching(true)\n      }}\n      onClose={() => setIsSearching(false)}\n      options={options}\n      filterOptions={x => x}\n      loading={isLoading || inputValue !== debouncedInput}\n      isOptionEqualToValue={(option, val) => option.ownerId === val.ownerId}\n      getOptionLabel={option => option.userName}\n      renderOption={(optionProps, option) => (\n        <li {...optionProps} key={option.ownerId}>\n          <UserOrTeamBadge\n            userGroupHeader={option}\n            disableHref\n            showFullName\n            showCardOnHover={false}\n          />\n        </li>\n      )}\n      renderInput={({\n        inputProps: inputPropsFromParams,\n        InputProps: InputPropsFromParams,\n        ...params\n      }) => (\n        <TextField\n          {...params}\n          placeholder={showBadge ? undefined : placeholderText}\n          autoFocus={autoFocus}\n          slotProps={{\n            htmlInput: {\n              ...inputPropsFromParams,\n              // While the badge is displayed, hide the underlying input text and cursor.\n              // Merge custom styles with parent styles to preserve mouse selection and other behaviors.\n              style: {\n                ...inputPropsFromParams.style,\n                ...(showBadge ? { color: 'transparent' } : {}),\n              },\n            },\n            input: {\n              ...InputPropsFromParams,\n              startAdornment: showBadge ? (\n                <Box sx={{ ml: 1 }}>\n                  <UserOrTeamBadge\n                    userGroupHeader={resolvedValue}\n                    disableHref\n                    showFullName\n                    showCardOnHover={false}\n                  />\n                </Box>\n              ) : undefined,\n            },\n          }}\n        />\n      )}\n      onChange={(_event, newValue) => {\n        if (!isControlled) {\n          setInternalValue(newValue)\n        }\n        onChange?.(\n          newValue?.ownerId != null ? newValue.ownerId.toString() : null,\n          newValue ?? null,\n        )\n      }}\n      noOptionsText={\n        isLoading || inputValue !== debouncedInput ? 'Loading…' : 'No options'\n      }\n      clearOnEscape\n    />\n  )\n}\n\nexport default UserSearchBox\n"],"mappings":";;;;;;;;;AAmCA,SAAS,EAAc,GAA2B;CAChD,IAAM,EACJ,YACA,kBAAe,MACf,aACA,oBACA,eACA,gBACA,eAAY,IACZ,OAAO,MACL,GAEE,IAAe,MAAc,KAAA,GAE7B,CAAC,GAAY,KAAiB,EAAS,GAAG,EAC1C,CAAC,GAAgB,KAAqB,EAAS,GAAG;AACxD,SACQ;AACJ,IAAkB,EAAW;IAE/B,CAAC,EAAW,EACZ,IACD;CAID,IAAM,CAAC,GAAa,KAAkB,EAAS,GAAM,EAG/C,EAAE,MAAM,GAAwB,WAAW,MAC/C,EAAsB,KAAgB,IAAI,EACxC,SAAS,CAAC,CAAC,KAAgB,CAAC,GAC7B,CAAC,EAGE,IACJ,KAAgB,OAAO,KAAc,WAAW,IAAY,MAExD,EACJ,MAAM,GACN,WAAW,MACT,EAAsB,KAAyB,IAAI,EACrD,SAAS,CAAC,CAAC,GACZ,CAAC,EAMI,CAAC,GAAe,KAAoB,EAExC,KAAA,EAAU,EAMN,IAAwC,IAH5C,OAAO,KAAc,WAAW,KAA4B,OAAO,OAEnE,MAAkB,KAAA,IAA4B,KAA0B,OAA1C,GAO1B,IAAY,MAAkB,QAAQ,CAAC,GAGvC,EAAE,SAAM,iBAAc,EAC1B,GACA,GACA,EACE,SAAS,CALY,CAAC,GAMvB,CACF,EAEK,IAAU,SACP,KAAQ,EAAE,EAAE,OAAO,YAA0B,IAAM,EAC1D,CAAC,GAAM,EAAgB,CACxB,EAEK,IAAkB,QAClB,MAAgB,KAAA,IAET,KAAc,EAAY,aAC5B,0BACE,KAAc,EAAY,aAC5B,cAEA,uCANA,GAQR,CAAC,GAAa,EAAW,CAAC;AAM7B,QAJI,KAAyB,IACpB,kBAAC,GAAD,EAAU,OAAM,QAAS,CAAA,GAIhC,kBAAC,GAAD;EACE,IAAI;EACJ,OAAO;EACK;EACZ,gBAAgB,GAAQ,GAAe,MAAW;AAChD,GAEE,EAFE,MAAW,kBAAkB,MAAW,UAE5B,KAEA,EAAc;;EAIhC,aAAa,MAAkB;EAC/B,cAAc;AACZ,KAAe,GAAK;;EAEtB,eAAe,EAAe,GAAM;EAC3B;EACT,gBAAe,MAAK;EACpB,SAAS,KAAa,MAAe;EACrC,uBAAuB,GAAQ,MAAQ,EAAO,YAAY,EAAI;EAC9D,iBAAgB,MAAU,EAAO;EACjC,eAAe,GAAa,MAC1B,kBAAC,MAAD;GAAI,GAAI;GAAa,KAAK,EAAO;GAO5B,EANH,kBAAC,GAAD;GACE,iBAAiB;GACjB,aAAA;GACA,cAAA;GACA,iBAAiB;GACjB,CAAA,CACC;EAEP,cAAc,EACZ,YAAY,GACZ,YAAY,GACZ,GAAG,QAEH,kBAAC,GAAD;GACE,GAAI;GACJ,aAAa,IAAY,KAAA,IAAY;GAC1B;GACX,WAAW;IACT,WAAW;KACT,GAAG;KAGH,OAAO;MACL,GAAG,EAAqB;MACxB,GAAI,IAAY,EAAE,OAAO,eAAe,GAAG,EAAE;MAC9C;KACF;IACD,OAAO;KACL,GAAG;KACH,gBAAgB,IACd,kBAAC,GAAD;MAAK,IAAI,EAAE,IAAI,GAAG;gBAChB,kBAAC,GAAD;OACE,iBAAiB;OACjB,aAAA;OACA,cAAA;OACA,iBAAiB;OACjB,CAAA;MACE,CAAA,GACJ,KAAA;KACL;IACF;GACD,CAAA;EAEJ,WAAW,GAAQ,MAAa;AAI9B,GAHK,KACH,EAAiB,EAAS,EAE5B,IACE,GAAU,WAAW,OAAqC,OAA9B,EAAS,QAAQ,UAAU,EACvD,KAAY,KACb;;EAEH,eACE,KAAa,MAAe,IAAiB,aAAa;EAE5D,eAAA;EACA,CAAA"}

package/dist/components/Webhook/WebhookDashboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"WebhookDashboard.js","names":[],"sources":["../../../src/components/Webhook/WebhookDashboard.tsx"],"sourcesContent":["import InfiniteTableLayout from '@/components/layout/InfiniteTableLayout'\nimport {\n  useGetWebhooksInfinite,\n  useResendVerificationCode,\n} from '@/synapse-queries/webhook/useWebhook'\nimport { formatDate } from '@/utils/functions/DateFormatter'\nimport { AddCircleTwoTone } from '@mui/icons-material'\nimport {\n  Box,\n  Button,\n  Link,\n  Stack,\n  Typography,\n  useMediaQuery,\n  useTheme,\n} from '@mui/material'\nimport {\n  SynapseObjectType,\n  Webhook,\n  WebhookVerificationStatus,\n} from '@sage-bionetworks/synapse-client'\nimport {\n  createColumnHelper,\n  getCoreRowModel,\n  useReactTable,\n} from '@tanstack/react-table'\nimport dayjs from 'dayjs'\nimport { upperFirst } from 'lodash-es'\nimport { useCallback, useEffect, useMemo, useState } from 'react'\nimport { EntityLink } from '../EntityLink'\nimport { HelpPopover } from '../HelpPopover/HelpPopover'\nimport { SynapseSpinner } from '../LoadingScreen/LoadingScreen'\nimport StyledTanStackTable from '../TanStackTable/StyledTanStackTable'\nimport CreateWebhookModal from './CreateWebhookModal'\nimport { WebhookVerificationDialog } from './WebhookVerificationDialog'\n\nconst WEBHOOK_CAN_RESEND_CODE_STATES: WebhookVerificationStatus[] = [\n  WebhookVerificationStatus.FAILED,\n  WebhookVerificationStatus.REVOKED,\n]\n\nconst columnHelper = createColumnHelper<Webhook>()\n\nfunction getWebhookTableColumns(\n  onClickVerifyWebhook: (webhook: Webhook) => void,\n  onClickResendVerificationCode: (webhook: Webhook) => void,\n  onClickEditWebhook: (webhook: Webhook) => void,\n) {\n  return [\n    columnHelper.accessor('id', {\n      header: 'ID',\n      size: 75,\n      cell: ctx => ctx.cell.getValue(),\n    }),\n    columnHelper.display({\n      header: 'Object',\n      cell: ctx => {\n        if (ctx.row.original.objectType === SynapseObjectType.ENTITY) {\n          return (\n            <>\n              <EntityLink entity={ctx.row.original.objectId!} /> (syn\n              {ctx.row.original.objectId})\n            </>\n          )\n        }\n        return `${ctx.row.original.objectType}: ${ctx.row.original.objectId}`\n      },\n    }),\n    columnHelper.accessor('eventTypes', {\n      header: 'Event Type(s)',\n      cell: ctx => (\n        <Stack>\n          {Array.from<string>(ctx.cell.getValue()!)\n            .map(s => s.toLowerCase())\n            .map(upperFirst)\n            .map(val => (\n              <span key={val}>{val}</span>\n            ))}\n        </Stack>\n      ),\n    }),\n    columnHelper.accessor('isEnabled', {\n      header: 'Enabled',\n      size: 10,\n      cell: ctx => (ctx.cell.getValue() ? 'Yes' : 'No'),\n    }),\n    columnHelper.accessor('createdOn', {\n      header: 'Created On',\n      cell: ({ getValue }) => formatDate(dayjs(getValue())),\n    }),\n    columnHelper.accessor('modifiedOn', {\n      header: 'Modified On',\n      cell: ({ getValue }) => formatDate(dayjs(getValue())),\n    }),\n    columnHelper.accessor('verificationStatus', {\n      header: 'Verification Status',\n      cell: ctx => (\n        <Stack\n          sx={{\n            flexDirection: 'row',\n            alignItems: 'center',\n            gap: 1,\n          }}\n        >\n          {ctx.row.original.verificationStatus === 'PENDING' && (\n            // useEffect above will trigger a refetch until this resolves\n            <SynapseSpinner size={20} />\n          )}\n          {ctx.row.original.verificationStatus !==\n            WebhookVerificationStatus.PENDING &&\n            upperFirst(\n              (ctx.row.original.verificationStatus || '')\n                .toLowerCase()\n                .replaceAll('_', ' '),\n            )}\n          {ctx.row.original.verificationMsg && (\n            <HelpPopover markdownText={ctx.row.original.verificationMsg} />\n          )}\n        </Stack>\n      ),\n    }),\n    columnHelper.display({\n      id: 'actions',\n      header: 'Actions',\n      size: 10,\n      meta: {\n        textAlign: 'right',\n      },\n      cell: ctx => (\n        <Stack\n          sx={{\n            flexDirection: 'row',\n            justifyContent: 'flex-end',\n            alignItems: 'center',\n            gap: 2,\n          }}\n        >\n          {ctx.row.original.verificationStatus ===\n            WebhookVerificationStatus.CODE_SENT && (\n            <Button\n              variant={'outlined'}\n              onClick={() => {\n                onClickVerifyWebhook(ctx.row.original)\n              }}\n            >\n              Verify code\n            </Button>\n          )}\n\n          {WEBHOOK_CAN_RESEND_CODE_STATES.includes(\n            ctx.row.original.verificationStatus as WebhookVerificationStatus,\n          ) && (\n            <Button\n              variant={'outlined'}\n              onClick={() => {\n                onClickResendVerificationCode(ctx.row.original)\n              }}\n            >\n              Resend code\n            </Button>\n          )}\n          <Button\n            size=\"small\"\n            variant=\"contained\"\n            onClick={() => {\n              onClickEditWebhook(ctx.row.original)\n            }}\n          >\n            Edit\n          </Button>\n        </Stack>\n      ),\n    }),\n  ]\n}\n\nexport default function WebhookDashboard() {\n  const [showCreateModal, setShowCreateModal] = useState(false)\n  const [showVerificationDialog, setShowVerificationDialog] = useState(false)\n  const [webhookToUpdate, setWebhookToUpdate] = useState<Webhook | undefined>(\n    undefined,\n  )\n\n  const theme = useTheme()\n  const hideOptionalColumns = useMediaQuery(theme.breakpoints.down('md'))\n\n  const {\n    data: infiniteData,\n    refetch,\n    hasNextPage,\n    fetchNextPage,\n    isFetchingNextPage,\n    isLoading,\n  } = useGetWebhooksInfinite()\n  const webhooks = useMemo(\n    () => infiniteData?.pages.flatMap(page => page.page!) ?? [],\n    [infiniteData],\n  )\n\n  // If the Webhook verification status is PENDING, Synapse may not have sent the verification code, or may have not reported a response.\n  // Refetch on an interval to check if the verification status has changed.\n  useEffect(() => {\n    let intervalId: NodeJS.Timeout\n    if (webhooks.some(webhook => webhook.verificationStatus === 'PENDING')) {\n      intervalId = setInterval(() => {\n        void refetch()\n      }, 2500)\n    }\n    return () => clearInterval(intervalId)\n  }, [refetch, webhooks])\n\n  const { mutate: resendVerificationCode } = useResendVerificationCode()\n\n  const onClickVerifyWebhook = useCallback((webhook: Webhook) => {\n    setWebhookToUpdate(webhook)\n    setShowVerificationDialog(true)\n  }, [])\n  const onClickEditWebhook = useCallback((webhook: Webhook) => {\n    setWebhookToUpdate(webhook)\n    setShowCreateModal(true)\n  }, [])\n  const onClickResendVerificationCode = useCallback(\n    (webhook: Webhook) => {\n      resendVerificationCode(webhook.id!)\n    },\n    [resendVerificationCode],\n  )\n\n  const columns = useMemo(\n    () =>\n      getWebhookTableColumns(\n        onClickVerifyWebhook,\n        onClickResendVerificationCode,\n        onClickEditWebhook,\n      ),\n    [onClickEditWebhook, onClickResendVerificationCode, onClickVerifyWebhook],\n  )\n\n  const webhookTable = useReactTable<Webhook>({\n    data: webhooks,\n    columns: columns,\n    state: {\n      columnVisibility: {\n        createdOn: !hideOptionalColumns,\n        modifiedOn: !hideOptionalColumns,\n      },\n    },\n    getCoreRowModel: getCoreRowModel(),\n  })\n\n  const isEmpty = !isLoading && webhookTable.getRowModel().rows.length === 0\n\n  return (\n    <div>\n      <WebhookVerificationDialog\n        key={webhookToUpdate?.id}\n        open={showVerificationDialog}\n        onClose={() => setShowVerificationDialog(false)}\n        webhookId={webhookToUpdate?.id!}\n      />\n      <Typography variant={'headline3'}>Webhook Dashboard</Typography>\n      <Box\n        sx={{\n          display: 'flex',\n          flexDirection: 'row',\n          my: 2,\n          gap: 3,\n          justifyContent: 'space-between',\n          alignItems: 'flex-start',\n        }}\n      >\n        <div>\n          <Typography variant={'body1'} gutterBottom>\n            Webhooks can be used to programmatically receive alerts that are\n            triggered by events in Synapse. A webhook can specify a Synapse\n            entity to receive events related to that entity. For entities that\n            represent a container (folder and project), matching events are\n            published to the webhook endpoint for any entity in its hierarchy.\n          </Typography>\n          <Typography variant={'body1'} gutterBottom>\n            For more information, see the{' '}\n            <Link\n              href={\n                'http://dev.release.rest.doc.sagebase.org.s3-website-us-east-1.amazonaws.com/index.html#org.sagebionetworks.repo.web.controller.WebhookController'\n              }\n              target={'blank'}\n            >\n              Synapse API REST Docs section on Webhooks\n            </Link>\n            .\n          </Typography>\n        </div>\n        <Button\n          size=\"large\"\n          variant=\"contained\"\n          startIcon={<AddCircleTwoTone />}\n          onClick={() => {\n            setWebhookToUpdate(undefined)\n            setShowCreateModal(true)\n          }}\n          sx={{ flexShrink: 0 }}\n        >\n          Create Webhook\n        </Button>\n        <CreateWebhookModal\n          initialData={webhookToUpdate}\n          open={showCreateModal}\n          onClose={() => setShowCreateModal(false)}\n        />\n      </Box>\n      <InfiniteTableLayout\n        table={<StyledTanStackTable table={webhookTable} />}\n        isLoading={isLoading}\n        noResults={\n          <Typography variant=\"body1\">\n            You have not created any webhooks. Click &quot;Create Webhook&quot;\n            above to begin.\n          </Typography>\n        }\n        isEmpty={isEmpty}\n        hasNextPage={hasNextPage}\n        onFetchNextPageClicked={() => {\n          void fetchNextPage()\n        }}\n        isFetchingNextPage={isFetchingNextPage}\n      />\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAoCA,IAAM,IAA8D,CAClE,EAA0B,QAC1B,EAA0B,QAC3B,EAEK,IAAe,GAA6B;AAElD,SAAS,EACP,GACA,GACA,GACA;AACA,QAAO;EACL,EAAa,SAAS,MAAM;GAC1B,QAAQ;GACR,MAAM;GACN,OAAM,MAAO,EAAI,KAAK,UAAU;GACjC,CAAC;EACF,EAAa,QAAQ;GACnB,QAAQ;GACR,OAAM,MACA,EAAI,IAAI,SAAS,eAAe,EAAkB,SAElD,kBAAA,GAAA,EAAA,UAAA;IACE,kBAAC,GAAD,EAAY,QAAQ,EAAI,IAAI,SAAS,UAAa,CAAA;;IACjD,EAAI,IAAI,SAAS;IAAS;IAC1B,EAAA,CAAA,GAGA,GAAG,EAAI,IAAI,SAAS,WAAW,IAAI,EAAI,IAAI,SAAS;GAE9D,CAAC;EACF,EAAa,SAAS,cAAc;GAClC,QAAQ;GACR,OAAM,MACJ,kBAAC,GAAD,EAAA,UACG,MAAM,KAAa,EAAI,KAAK,UAAU,CAAE,CACtC,KAAI,MAAK,EAAE,aAAa,CAAC,CACzB,IAAI,EAAW,CACf,KAAI,MACH,kBAAC,QAAD,EAAA,UAAiB,GAAW,EAAjB,EAAiB,CAC5B,EACE,CAAA;GAEX,CAAC;EACF,EAAa,SAAS,aAAa;GACjC,QAAQ;GACR,MAAM;GACN,OAAM,MAAQ,EAAI,KAAK,UAAU,GAAG,QAAQ;GAC7C,CAAC;EACF,EAAa,SAAS,aAAa;GACjC,QAAQ;GACR,OAAO,EAAE,kBAAe,EAAW,EAAM,GAAU,CAAC,CAAC;GACtD,CAAC;EACF,EAAa,SAAS,cAAc;GAClC,QAAQ;GACR,OAAO,EAAE,kBAAe,EAAW,EAAM,GAAU,CAAC,CAAC;GACtD,CAAC;EACF,EAAa,SAAS,sBAAsB;GAC1C,QAAQ;GACR,OAAM,MACJ,kBAAC,GAAD;IACE,IAAI;KACF,eAAe;KACf,YAAY;KACZ,KAAK;KACN;cALH;KAOG,EAAI,IAAI,SAAS,uBAAuB,aAEvC,kBAAC,GAAD,EAAgB,MAAM,IAAM,CAAA;KAE7B,EAAI,IAAI,SAAS,uBAChB,EAA0B,WAC1B,GACG,EAAI,IAAI,SAAS,sBAAsB,IACrC,aAAa,CACb,WAAW,KAAK,IAAI,CACxB;KACF,EAAI,IAAI,SAAS,mBAChB,kBAAC,GAAD,EAAa,cAAc,EAAI,IAAI,SAAS,iBAAmB,CAAA;KAE3D;;GAEX,CAAC;EACF,EAAa,QAAQ;GACnB,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,MAAM,EACJ,WAAW,SACZ;GACD,OAAM,MACJ,kBAAC,GAAD;IACE,IAAI;KACF,eAAe;KACf,gBAAgB;KAChB,YAAY;KACZ,KAAK;KACN;cANH;KAQG,EAAI,IAAI,SAAS,uBAChB,EAA0B,aAC1B,kBAAC,GAAD;MACE,SAAS;MACT,eAAe;AACb,SAAqB,EAAI,IAAI,SAAS;;gBAEzC;MAEQ,CAAA;KAGV,EAA+B,SAC9B,EAAI,IAAI,SAAS,mBAClB,IACC,kBAAC,GAAD;MACE,SAAS;MACT,eAAe;AACb,SAA8B,EAAI,IAAI,SAAS;;gBAElD;MAEQ,CAAA;KAEX,kBAAC,GAAD;MACE,MAAK;MACL,SAAQ;MACR,eAAe;AACb,SAAmB,EAAI,IAAI,SAAS;;gBAEvC;MAEQ,CAAA;KACH;;GAEX,CAAC;EACH;;AAGH,SAAwB,IAAmB;CACzC,IAAM,CAAC,GAAiB,KAAsB,EAAS,GAAM,EACvD,CAAC,GAAwB,KAA6B,EAAS,GAAM,EACrE,CAAC,GAAiB,KAAsB,EAC5C,KAAA,EACD,EAGK,IAAsB,EADd,GAAU,CACwB,YAAY,KAAK,KAAK,CAAC,EAEjE,EACJ,MAAM,GACN,YACA,gBACA,kBACA,uBACA,iBACE,GAAwB,EACtB,IAAW,QACT,GAAc,MAAM,SAAQ,MAAQ,EAAK,KAAM,IAAI,EAAE,EAC3D,CAAC,EAAa,CACf;AAID,SAAgB;EACd,IAAI;AAMJ,SALI,EAAS,MAAK,MAAW,EAAQ,uBAAuB,UAAU,KACpE,IAAa,kBAAkB;AACxB,MAAS;KACb,KAAK,SAEG,cAAc,EAAW;IACrC,CAAC,GAAS,EAAS,CAAC;CAEvB,IAAM,EAAE,QAAQ,MAA2B,GAA2B,EAEhE,IAAuB,GAAa,MAAqB;AAE7D,EADA,EAAmB,EAAQ,EAC3B,EAA0B,GAAK;IAC9B,EAAE,CAAC,EACA,IAAqB,GAAa,MAAqB;AAE3D,EADA,EAAmB,EAAQ,EAC3B,EAAmB,GAAK;IACvB,EAAE,CAAC,EACA,IAAgC,GACnC,MAAqB;AACpB,IAAuB,EAAQ,GAAI;IAErC,CAAC,EAAuB,CACzB,EAYK,IAAe,EAAuB;EAC1C,MAAM;EACG,SAZK,QAEZ,EACE,GACA,GACA,EACD,EACH;GAAC;GAAoB;GAA+B;GAAqB,CAC1E;EAKC,OAAO,EACL,kBAAkB;GAChB,WAAW,CAAC;GACZ,YAAY,CAAC;GACd,EACF;EACD,iBAAiB,GAAiB;EACnC,CAAC,EAEI,IAAU,CAAC,KAAa,EAAa,aAAa,CAAC,KAAK,WAAW;AAEzE,QACE,kBAAC,OAAD,EAAA,UAAA;EACE,kBAAC,GAAD;GAEE,MAAM;GACN,eAAe,EAA0B,GAAM;GAC/C,WAAW,GAAiB;GAC5B,EAJK,GAAiB,GAItB;EACF,kBAAC,GAAD;GAAY,SAAS;aAAa;GAA8B,CAAA;EAChE,kBAAC,GAAD;GACE,IAAI;IACF,SAAS;IACT,eAAe;IACf,IAAI;IACJ,KAAK;IACL,gBAAgB;IAChB,YAAY;IACb;aARH;IAUE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,GAAD;KAAY,SAAS;KAAS,cAAA;eAAa;KAM9B,CAAA,EACb,kBAAC,GAAD;KAAY,SAAS;KAAS,cAAA;eAA9B;MAA2C;MACX;MAC9B,kBAAC,GAAD;OACE,MACE;OAEF,QAAQ;iBACT;OAEM,CAAA;;MAEI;OACT,EAAA,CAAA;IACN,kBAAC,GAAD;KACE,MAAK;KACL,SAAQ;KACR,WAAW,kBAAC,GAAD,EAAoB,CAAA;KAC/B,eAAe;AAEb,MADA,EAAmB,KAAA,EAAU,EAC7B,EAAmB,GAAK;;KAE1B,IAAI,EAAE,YAAY,GAAG;eACtB;KAEQ,CAAA;IACT,kBAAC,GAAD;KACE,aAAa;KACb,MAAM;KACN,eAAe,EAAmB,GAAM;KACxC,CAAA;IACE;;EACN,kBAAC,GAAD;GACE,OAAO,kBAAC,GAAD,EAAqB,OAAO,GAAgB,CAAA;GACxC;GACX,WACE,kBAAC,GAAD;IAAY,SAAQ;cAAQ;IAGf,CAAA;GAEN;GACI;GACb,8BAA8B;AACvB,OAAe;;GAEF;GACpB,CAAA;EACE,EAAA,CAAA"}
+{"version":3,"file":"WebhookDashboard.js","names":[],"sources":["../../../src/components/Webhook/WebhookDashboard.tsx"],"sourcesContent":["import InfiniteTableLayout from '@/components/layout/InfiniteTableLayout'\nimport {\n  useGetWebhooksInfinite,\n  useResendVerificationCode,\n} from '@/synapse-queries/webhook/useWebhook'\nimport { formatDate } from '@/utils/functions/DateFormatter'\nimport { AddCircleTwoTone } from '@mui/icons-material'\nimport {\n  Box,\n  Button,\n  Link,\n  Stack,\n  Typography,\n  useMediaQuery,\n  useTheme,\n} from '@mui/material'\nimport {\n  SynapseObjectType,\n  Webhook,\n  WebhookVerificationStatus,\n} from '@sage-bionetworks/synapse-client'\nimport {\n  createColumnHelper,\n  getCoreRowModel,\n  useReactTable,\n} from '@tanstack/react-table'\nimport dayjs from 'dayjs'\nimport { upperFirst } from 'lodash-es'\nimport { useCallback, useEffect, useMemo, useState } from 'react'\nimport { EntityLink } from '../EntityLink'\nimport { HelpPopover } from '../HelpPopover/HelpPopover'\nimport { SynapseSpinner } from '../LoadingScreen/LoadingScreen'\nimport StyledTanStackTable from '../TanStackTable/StyledTanStackTable'\nimport CreateWebhookModal from './CreateWebhookModal'\nimport { WebhookVerificationDialog } from './WebhookVerificationDialog'\n\nconst WEBHOOK_CAN_RESEND_CODE_STATES: WebhookVerificationStatus[] = [\n  WebhookVerificationStatus.FAILED,\n  WebhookVerificationStatus.REVOKED,\n]\n\nconst columnHelper = createColumnHelper<Webhook>()\n\nfunction getWebhookTableColumns(\n  onClickVerifyWebhook: (webhook: Webhook) => void,\n  onClickResendVerificationCode: (webhook: Webhook) => void,\n  onClickEditWebhook: (webhook: Webhook) => void,\n) {\n  return [\n    columnHelper.accessor('id', {\n      header: 'ID',\n      size: 75,\n      cell: ctx => ctx.cell.getValue(),\n    }),\n    columnHelper.display({\n      header: 'Object',\n      cell: ctx => {\n        if (ctx.row.original.objectType === SynapseObjectType.ENTITY) {\n          return (\n            <>\n              <EntityLink entity={ctx.row.original.objectId!} /> (syn\n              {ctx.row.original.objectId})\n            </>\n          )\n        }\n        return `${ctx.row.original.objectType}: ${ctx.row.original.objectId}`\n      },\n    }),\n    columnHelper.accessor('eventTypes', {\n      header: 'Event Type(s)',\n      cell: ctx => (\n        <Stack>\n          {Array.from<string>(ctx.cell.getValue()!)\n            .map(s => s.toLowerCase())\n            .map(upperFirst)\n            .map(val => (\n              <span key={val}>{val}</span>\n            ))}\n        </Stack>\n      ),\n    }),\n    columnHelper.accessor('isEnabled', {\n      header: 'Enabled',\n      size: 10,\n      cell: ctx => (ctx.cell.getValue() ? 'Yes' : 'No'),\n    }),\n    columnHelper.accessor('createdOn', {\n      header: 'Created On',\n      cell: ({ getValue }) => formatDate(dayjs(getValue())),\n    }),\n    columnHelper.accessor('modifiedOn', {\n      header: 'Modified On',\n      cell: ({ getValue }) => formatDate(dayjs(getValue())),\n    }),\n    columnHelper.accessor('verificationStatus', {\n      header: 'Verification Status',\n      cell: ctx => (\n        <Stack\n          sx={{\n            flexDirection: 'row',\n            alignItems: 'center',\n            gap: 1,\n          }}\n        >\n          {ctx.row.original.verificationStatus === 'PENDING' && (\n            // useEffect above will trigger a refetch until this resolves\n            <SynapseSpinner size={20} />\n          )}\n          {ctx.row.original.verificationStatus !==\n            WebhookVerificationStatus.PENDING &&\n            upperFirst(\n              (ctx.row.original.verificationStatus || '')\n                .toLowerCase()\n                .replaceAll('_', ' '),\n            )}\n          {ctx.row.original.verificationMsg && (\n            <HelpPopover markdownText={ctx.row.original.verificationMsg} />\n          )}\n        </Stack>\n      ),\n    }),\n    columnHelper.display({\n      id: 'actions',\n      header: 'Actions',\n      size: 10,\n      meta: {\n        textAlign: 'right',\n      },\n      cell: ctx => (\n        <Stack\n          sx={{\n            flexDirection: 'row',\n            justifyContent: 'flex-end',\n            alignItems: 'center',\n            gap: 2,\n          }}\n        >\n          {ctx.row.original.verificationStatus ===\n            WebhookVerificationStatus.CODE_SENT && (\n            <Button\n              variant={'outlined'}\n              onClick={() => {\n                onClickVerifyWebhook(ctx.row.original)\n              }}\n            >\n              Verify code\n            </Button>\n          )}\n\n          {WEBHOOK_CAN_RESEND_CODE_STATES.includes(\n            ctx.row.original.verificationStatus as WebhookVerificationStatus,\n          ) && (\n            <Button\n              variant={'outlined'}\n              onClick={() => {\n                onClickResendVerificationCode(ctx.row.original)\n              }}\n            >\n              Resend code\n            </Button>\n          )}\n          <Button\n            size=\"small\"\n            variant=\"contained\"\n            onClick={() => {\n              onClickEditWebhook(ctx.row.original)\n            }}\n          >\n            Edit\n          </Button>\n        </Stack>\n      ),\n    }),\n  ]\n}\n\nexport default function WebhookDashboard() {\n  const [showCreateModal, setShowCreateModal] = useState(false)\n  const [showVerificationDialog, setShowVerificationDialog] = useState(false)\n  const [webhookToUpdate, setWebhookToUpdate] = useState<Webhook | undefined>(\n    undefined,\n  )\n\n  const theme = useTheme()\n  const hideOptionalColumns = useMediaQuery(theme.breakpoints.down('md'))\n\n  const {\n    data: infiniteData,\n    refetch,\n    hasNextPage,\n    fetchNextPage,\n    isFetchingNextPage,\n    isLoading,\n  } = useGetWebhooksInfinite()\n  const webhooks = useMemo(\n    () => infiniteData?.pages.flatMap(page => page.page!) ?? [],\n    [infiniteData],\n  )\n\n  // If the Webhook verification status is PENDING, Synapse may not have sent the verification code, or may have not reported a response.\n  // Refetch on an interval to check if the verification status has changed.\n  useEffect(() => {\n    let intervalId: NodeJS.Timeout\n    if (webhooks.some(webhook => webhook.verificationStatus === 'PENDING')) {\n      intervalId = setInterval(() => {\n        void refetch()\n      }, 2500)\n    }\n    return () => clearInterval(intervalId)\n  }, [refetch, webhooks])\n\n  const { mutate: resendVerificationCode } = useResendVerificationCode()\n\n  const onClickVerifyWebhook = useCallback((webhook: Webhook) => {\n    setWebhookToUpdate(webhook)\n    setShowVerificationDialog(true)\n  }, [])\n  const onClickEditWebhook = useCallback((webhook: Webhook) => {\n    setWebhookToUpdate(webhook)\n    setShowCreateModal(true)\n  }, [])\n  const onClickResendVerificationCode = useCallback(\n    (webhook: Webhook) => {\n      resendVerificationCode(webhook.id!)\n    },\n    [resendVerificationCode],\n  )\n\n  const columns = useMemo(\n    () =>\n      getWebhookTableColumns(\n        onClickVerifyWebhook,\n        onClickResendVerificationCode,\n        onClickEditWebhook,\n      ),\n    [onClickEditWebhook, onClickResendVerificationCode, onClickVerifyWebhook],\n  )\n\n  const webhookTable = useReactTable<Webhook>({\n    data: webhooks,\n    columns: columns,\n    state: {\n      columnVisibility: {\n        createdOn: !hideOptionalColumns,\n        modifiedOn: !hideOptionalColumns,\n      },\n    },\n    getCoreRowModel: getCoreRowModel(),\n  })\n\n  const isEmpty = !isLoading && webhookTable.getRowModel().rows.length === 0\n\n  return (\n    <div>\n      <WebhookVerificationDialog\n        key={webhookToUpdate?.id}\n        open={showVerificationDialog}\n        onClose={() => setShowVerificationDialog(false)}\n        webhookId={webhookToUpdate?.id!}\n      />\n      <Typography variant={'headline3'}>Webhook Dashboard</Typography>\n      <Box\n        sx={{\n          display: 'flex',\n          flexDirection: 'row',\n          my: 2,\n          gap: 3,\n          justifyContent: 'space-between',\n          alignItems: 'flex-start',\n        }}\n      >\n        <div>\n          <Typography variant={'body1'} gutterBottom>\n            Webhooks can be used to programmatically receive alerts that are\n            triggered by events in Synapse. A webhook can specify a Synapse\n            entity to receive events related to that entity. For entities that\n            represent a container (folder and project), matching events are\n            published to the webhook endpoint for any entity in its hierarchy.\n          </Typography>\n          <Typography variant={'body1'} gutterBottom>\n            For more information, see the{' '}\n            <Link\n              href={\n                'http://dev.release.rest.doc.sagebase.org.s3-website-us-east-1.amazonaws.com/index.html#org.sagebionetworks.repo.web.controller.WebhookController'\n              }\n              target={'blank'}\n            >\n              Synapse API REST Docs section on Webhooks\n            </Link>\n            .\n          </Typography>\n        </div>\n        <Button\n          size=\"large\"\n          variant=\"contained\"\n          startIcon={<AddCircleTwoTone />}\n          onClick={() => {\n            setWebhookToUpdate(undefined)\n            setShowCreateModal(true)\n          }}\n          sx={{ flexShrink: 0 }}\n        >\n          Create Webhook\n        </Button>\n        <CreateWebhookModal\n          initialData={webhookToUpdate}\n          open={showCreateModal}\n          onClose={() => setShowCreateModal(false)}\n        />\n      </Box>\n      <InfiniteTableLayout\n        table={<StyledTanStackTable table={webhookTable} />}\n        isLoading={isLoading}\n        noResults={\n          <Typography variant=\"body1\">\n            You have not created any webhooks. Click &quot;Create Webhook&quot;\n            above to begin.\n          </Typography>\n        }\n        isEmpty={isEmpty}\n        hasNextPage={hasNextPage}\n        onFetchNextPageClicked={() => {\n          void fetchNextPage()\n        }}\n        isFetchingNextPage={isFetchingNextPage}\n      />\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/components/WikiMarkdownEditor/WikiMarkdownEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"WikiMarkdownEditor.js","names":[],"sources":["../../../src/components/WikiMarkdownEditor/WikiMarkdownEditor.tsx"],"sourcesContent":["import { UpdateWikiPageInput, useUpdateWikiPage } from '@/synapse-queries'\nimport { Alert, Box, Button, TextField } from '@mui/material'\nimport { ObjectType, WikiPage } from '@sage-bionetworks/synapse-types'\nimport { noop } from 'lodash-es'\nimport { useState } from 'react'\nimport ConfirmationDialog from '../ConfirmationDialog'\nimport { DialogBase } from '../DialogBase'\nimport { SynapseSpinner } from '../LoadingScreen/LoadingScreen'\nimport { MarkdownEditor } from '../Markdown/MarkdownEditor'\n\nexport const UNSAVED_CHANGES = 'Unsaved Changes'\nexport const NAVIGATE_AWAY_CONFIRMATION_MESSAGE =\n  'Any unsaved changes may be lost. Are you sure that you would like to navigate away from this editor?'\nexport const ERROR_SAVING_WIKI =\n  'Could not save your changes. It is recommended that you copy your version of the wiki text so that it is not lost. '\n\nexport type WikiMarkdownEditorProps = {\n  open: boolean\n  ownerObjectType: ObjectType\n  ownerObjectId: string\n  wikiPage: WikiPage\n  onCancel?: () => void\n  onSave?: () => void\n  // TODO: SWC-6774 - expose delete prop\n  // showDeleteButton: boolean\n}\n\nexport function WikiMarkdownEditor(props: WikiMarkdownEditorProps) {\n  // TODO: SWC-6774 - get showDeleteButton from props\n  const showDeleteButton = false\n  const {\n    open,\n    ownerObjectId,\n    ownerObjectType,\n    wikiPage,\n    onCancel = noop,\n    onSave = noop,\n  } = props\n\n  const [title, setTitle] = useState<string>(wikiPage.title)\n  const [markdown, setMarkdown] = useState<string>(wikiPage.markdown)\n  const [showConfirmCancelDialog, setShowConfirmDialog] =\n    useState<boolean>(false)\n\n  const handleCancel = () => {\n    if (wikiPage && wikiPage.markdown !== markdown) {\n      setShowConfirmDialog(true)\n    } else {\n      onCancel()\n    }\n  }\n\n  const {\n    mutate: updateWikiPage,\n    isPending: isUpdatingWikiPage,\n    error: errorUpdatingWikiPage,\n  } = useUpdateWikiPage({\n    onSuccess: () => onSave(),\n  })\n\n  return (\n    <DialogBase\n      open={open}\n      onCancel={handleCancel}\n      maxWidth={'xl'}\n      fullWidth={true}\n      title=\"Edit Wiki Markdown\"\n      content={\n        <>\n          {isUpdatingWikiPage && <SynapseSpinner />}\n          {wikiPage && (\n            <>\n              {wikiPage.parentWikiId && (\n                <TextField\n                  label=\"Title\"\n                  placeholder=\"Title\"\n                  fullWidth\n                  sx={{ mb: 2 }}\n                  value={title}\n                  onChange={e => setTitle(e.target.value)}\n                />\n              )}\n              <MarkdownEditor text={markdown} setText={setMarkdown} />\n              <ConfirmationDialog\n                open={showConfirmCancelDialog}\n                title={UNSAVED_CHANGES}\n                content={NAVIGATE_AWAY_CONFIRMATION_MESSAGE}\n                onCancel={() => setShowConfirmDialog(false)}\n                onConfirm={() => {\n                  setShowConfirmDialog(false)\n                  onCancel()\n                }}\n              />\n            </>\n          )}\n          {errorUpdatingWikiPage && (\n            <Alert severity=\"error\">\n              {ERROR_SAVING_WIKI + errorUpdatingWikiPage.reason}\n            </Alert>\n          )}\n        </>\n      }\n      actions={\n        <Box\n          sx={{\n            display: 'flex',\n            flexDirection: 'row-reverse',\n            justifyContent: 'space-between',\n            width: '100%',\n          }}\n        >\n          <Box\n            sx={{\n              display: 'flex',\n              gap: 1,\n            }}\n          >\n            <Button\n              variant=\"outlined\"\n              disabled={isUpdatingWikiPage}\n              onClick={handleCancel}\n            >\n              Cancel\n            </Button>\n            <Button\n              variant=\"contained\"\n              color=\"primary\"\n              disabled={isUpdatingWikiPage}\n              onClick={() => {\n                if (wikiPage) {\n                  const input: UpdateWikiPageInput = {\n                    ownerObjectId,\n                    ownerObjectType,\n                    wikiPage: { ...wikiPage, title: title, markdown: markdown },\n                  }\n                  updateWikiPage(input)\n                }\n              }}\n            >\n              {isUpdatingWikiPage ? 'Saving...' : 'Save'}\n            </Button>\n          </Box>\n          {showDeleteButton && (\n            <Button\n              variant=\"contained\"\n              color=\"error\"\n              disabled={isUpdatingWikiPage}\n              onClick={() => {\n                // TODO: SWC-6774 - implement delete functionality\n              }}\n            >\n              Delete Page\n            </Button>\n          )}\n        </Box>\n      }\n    />\n  )\n}\n\nexport default WikiMarkdownEditor\n"],"mappings":";;;;;;;;;;;AAUA,IAAa,IAAkB,mBAClB,IACX,wGACW,IACX;AAaF,SAAgB,EAAmB,GAAgC;CAEjE,IACM,EACJ,SACA,kBACA,oBACA,aACA,cAAW,GACX,YAAS,MACP,GAEE,CAAC,GAAO,KAAY,EAAiB,EAAS,MAAM,EACpD,CAAC,GAAU,KAAe,EAAiB,EAAS,SAAS,EAC7D,CAAC,GAAyB,KAC9B,EAAkB,GAAM,EAEpB,UAAqB;AACzB,EAAI,KAAY,EAAS,aAAa,IACpC,EAAqB,GAAK,GAE1B,GAAU;IAIR,EACJ,QAAQ,GACR,WAAW,GACX,OAAO,MACL,EAAkB,EACpB,iBAAiB,GAAQ,EAC1B,CAAC;AAEF,QACE,kBAAC,GAAD;EACQ;EACN,UAAU;EACV,UAAU;EACV,WAAW;EACX,OAAM;EACN,SACE,kBAAA,GAAA,EAAA,UAAA;GACG,KAAsB,kBAAC,GAAD,EAAkB,CAAA;GACxC,KACC,kBAAA,GAAA,EAAA,UAAA;IACG,EAAS,gBACR,kBAAC,GAAD;KACE,OAAM;KACN,aAAY;KACZ,WAAA;KACA,IAAI,EAAE,IAAI,GAAG;KACb,OAAO;KACP,WAAU,MAAK,EAAS,EAAE,OAAO,MAAM;KACvC,CAAA;IAEJ,kBAAC,GAAD;KAAgB,MAAM;KAAU,SAAS;KAAe,CAAA;IACxD,kBAAC,GAAD;KACE,MAAM;KACN,OAAA;KACA,SAAA;KACA,gBAAgB,EAAqB,GAAM;KAC3C,iBAAiB;AAEf,MADA,EAAqB,GAAM,EAC3B,GAAU;;KAEZ,CAAA;IACD,EAAA,CAAA;GAEJ,KACC,kBAAC,GAAD;IAAO,UAAS;sIACO,EAAsB;IACrC,CAAA;GAET,EAAA,CAAA;EAEL,SACE,kBAAC,GAAD;GACE,IAAI;IACF,SAAS;IACT,eAAe;IACf,gBAAgB;IAChB,OAAO;IACR;aANH,CAQE,kBAAC,GAAD;IACE,IAAI;KACF,SAAS;KACT,KAAK;KACN;cAJH,CAME,kBAAC,GAAD;KACE,SAAQ;KACR,UAAU;KACV,SAAS;eACV;KAEQ,CAAA,EACT,kBAAC,GAAD;KACE,SAAQ;KACR,OAAM;KACN,UAAU;KACV,eAAe;AACb,MAAI,KAMF,EALmC;OACjC;OACA;OACA,UAAU;QAAE,GAAG;QAAiB;QAAiB;QAAU;OAC5D,CACoB;;eAIxB,IAAqB,cAAc;KAC7B,CAAA,CACL;OACL,GAYG;;EAER,CAAA"}
+{"version":3,"file":"WikiMarkdownEditor.js","names":[],"sources":["../../../src/components/WikiMarkdownEditor/WikiMarkdownEditor.tsx"],"sourcesContent":["import { UpdateWikiPageInput, useUpdateWikiPage } from '@/synapse-queries'\nimport { Alert, Box, Button, TextField } from '@mui/material'\nimport { ObjectType, WikiPage } from '@sage-bionetworks/synapse-types'\nimport { noop } from 'lodash-es'\nimport { useState } from 'react'\nimport ConfirmationDialog from '../ConfirmationDialog'\nimport { DialogBase } from '../DialogBase'\nimport { SynapseSpinner } from '../LoadingScreen/LoadingScreen'\nimport { MarkdownEditor } from '../Markdown/MarkdownEditor'\n\nexport const UNSAVED_CHANGES = 'Unsaved Changes'\nexport const NAVIGATE_AWAY_CONFIRMATION_MESSAGE =\n  'Any unsaved changes may be lost. Are you sure that you would like to navigate away from this editor?'\nexport const ERROR_SAVING_WIKI =\n  'Could not save your changes. It is recommended that you copy your version of the wiki text so that it is not lost. '\n\nexport type WikiMarkdownEditorProps = {\n  open: boolean\n  ownerObjectType: ObjectType\n  ownerObjectId: string\n  wikiPage: WikiPage\n  onCancel?: () => void\n  onSave?: () => void\n  // TODO: SWC-6774 - expose delete prop\n  // showDeleteButton: boolean\n}\n\nexport function WikiMarkdownEditor(props: WikiMarkdownEditorProps) {\n  // TODO: SWC-6774 - get showDeleteButton from props\n  const showDeleteButton = false\n  const {\n    open,\n    ownerObjectId,\n    ownerObjectType,\n    wikiPage,\n    onCancel = noop,\n    onSave = noop,\n  } = props\n\n  const [title, setTitle] = useState<string>(wikiPage.title)\n  const [markdown, setMarkdown] = useState<string>(wikiPage.markdown)\n  const [showConfirmCancelDialog, setShowConfirmDialog] =\n    useState<boolean>(false)\n\n  const handleCancel = () => {\n    if (wikiPage && wikiPage.markdown !== markdown) {\n      setShowConfirmDialog(true)\n    } else {\n      onCancel()\n    }\n  }\n\n  const {\n    mutate: updateWikiPage,\n    isPending: isUpdatingWikiPage,\n    error: errorUpdatingWikiPage,\n  } = useUpdateWikiPage({\n    onSuccess: () => onSave(),\n  })\n\n  return (\n    <DialogBase\n      open={open}\n      onCancel={handleCancel}\n      maxWidth={'xl'}\n      fullWidth={true}\n      title=\"Edit Wiki Markdown\"\n      content={\n        <>\n          {isUpdatingWikiPage && <SynapseSpinner />}\n          {wikiPage && (\n            <>\n              {wikiPage.parentWikiId && (\n                <TextField\n                  label=\"Title\"\n                  placeholder=\"Title\"\n                  fullWidth\n                  sx={{ mb: 2 }}\n                  value={title}\n                  onChange={e => setTitle(e.target.value)}\n                />\n              )}\n              <MarkdownEditor text={markdown} setText={setMarkdown} />\n              <ConfirmationDialog\n                open={showConfirmCancelDialog}\n                title={UNSAVED_CHANGES}\n                content={NAVIGATE_AWAY_CONFIRMATION_MESSAGE}\n                onCancel={() => setShowConfirmDialog(false)}\n                onConfirm={() => {\n                  setShowConfirmDialog(false)\n                  onCancel()\n                }}\n              />\n            </>\n          )}\n          {errorUpdatingWikiPage && (\n            <Alert severity=\"error\">\n              {ERROR_SAVING_WIKI + errorUpdatingWikiPage.reason}\n            </Alert>\n          )}\n        </>\n      }\n      actions={\n        <Box\n          sx={{\n            display: 'flex',\n            flexDirection: 'row-reverse',\n            justifyContent: 'space-between',\n            width: '100%',\n          }}\n        >\n          <Box\n            sx={{\n              display: 'flex',\n              gap: 1,\n            }}\n          >\n            <Button\n              variant=\"outlined\"\n              disabled={isUpdatingWikiPage}\n              onClick={handleCancel}\n            >\n              Cancel\n            </Button>\n            <Button\n              variant=\"contained\"\n              color=\"primary\"\n              disabled={isUpdatingWikiPage}\n              onClick={() => {\n                if (wikiPage) {\n                  const input: UpdateWikiPageInput = {\n                    ownerObjectId,\n                    ownerObjectType,\n                    wikiPage: { ...wikiPage, title: title, markdown: markdown },\n                  }\n                  updateWikiPage(input)\n                }\n              }}\n            >\n              {isUpdatingWikiPage ? 'Saving...' : 'Save'}\n            </Button>\n          </Box>\n          {showDeleteButton && (\n            <Button\n              variant=\"contained\"\n              color=\"error\"\n              disabled={isUpdatingWikiPage}\n              onClick={() => {\n                // TODO: SWC-6774 - implement delete functionality\n              }}\n            >\n              Delete Page\n            </Button>\n          )}\n        </Box>\n      }\n    />\n  )\n}\n\nexport default WikiMarkdownEditor\n"],"mappings":";;;;;;;;;;;AAUA,IAAa,IAAkB,mBAClB,IACX,wGACW,IACX;AAaF,SAAgB,EAAmB,GAAgC;CAEjE,IACM,EACJ,SACA,kBACA,oBACA,aACA,cAAW,GACX,YAAS,MACP,GAEE,CAAC,GAAO,KAAY,EAAiB,EAAS,MAAM,EACpD,CAAC,GAAU,KAAe,EAAiB,EAAS,SAAS,EAC7D,CAAC,GAAyB,KAC9B,EAAkB,GAAM,EAEpB,UAAqB;AACzB,EAAI,KAAY,EAAS,aAAa,IACpC,EAAqB,GAAK,GAE1B,GAAU;IAIR,EACJ,QAAQ,GACR,WAAW,GACX,OAAO,MACL,EAAkB,EACpB,iBAAiB,GAAQ,EAC1B,CAAC;AAEF,QACE,kBAAC,GAAD;EACQ;EACN,UAAU;EACV,UAAU;EACV,WAAW;EACX,OAAM;EACN,SACE,kBAAA,GAAA,EAAA,UAAA;GACG,KAAsB,kBAAC,GAAD,EAAkB,CAAA;GACxC,KACC,kBAAA,GAAA,EAAA,UAAA;IACG,EAAS,gBACR,kBAAC,GAAD;KACE,OAAM;KACN,aAAY;KACZ,WAAA;KACA,IAAI,EAAE,IAAI,GAAG;KACb,OAAO;KACP,WAAU,MAAK,EAAS,EAAE,OAAO,MAAM;KACvC,CAAA;IAEJ,kBAAC,GAAD;KAAgB,MAAM;KAAU,SAAS;KAAe,CAAA;IACxD,kBAAC,GAAD;KACE,MAAM;KACN,OAAA;KACA,SAAA;KACA,gBAAgB,EAAqB,GAAM;KAC3C,iBAAiB;AAEf,MADA,EAAqB,GAAM,EAC3B,GAAU;;KAEZ,CAAA;IACD,EAAA,CAAA;GAEJ,KACC,kBAAC,GAAD;IAAO,UAAS;sIACO,EAAsB;IACrC,CAAA;GAET,EAAA,CAAA;EAEL,SACE,kBAAC,GAAD;GACE,IAAI;IACF,SAAS;IACT,eAAe;IACf,gBAAgB;IAChB,OAAO;IACR;aANH,CAQE,kBAAC,GAAD;IACE,IAAI;KACF,SAAS;KACT,KAAK;KACN;cAJH,CAME,kBAAC,GAAD;KACE,SAAQ;KACR,UAAU;KACV,SAAS;eACV;KAEQ,CAAA,EACT,kBAAC,GAAD;KACE,SAAQ;KACR,OAAM;KACN,UAAU;KACV,eAAe;AACb,MAAI,KAMF,EAAe;OAJb;OACA;OACA,UAAU;QAAE,GAAG;QAAiB;QAAiB;QAAU;OAE9C,CAAM;;eAIxB,IAAqB,cAAc;KAC7B,CAAA,CACL;OACL,GAYG;;EAER,CAAA"}

package/dist/components/WikiMarkdownEditorButton/WikiMarkdownEditorButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"WikiMarkdownEditorButton.js","names":[],"sources":["../../../src/components/WikiMarkdownEditorButton/WikiMarkdownEditorButton.tsx"],"sourcesContent":["import {\n  CreateWikiPageInput,\n  useCreateWikiPage,\n  useGetRootWikiPageKey,\n  useGetWikiPage,\n} from '@/synapse-queries'\nimport { Alert, Box, Button, ButtonProps } from '@mui/material'\nimport { ObjectType, WikiPageKey } from '@sage-bionetworks/synapse-types'\nimport { defaults } from 'lodash-es'\nimport { useMemo, useState } from 'react'\nimport { SynapseSpinner } from '../LoadingScreen/LoadingScreen'\nimport MarkdownSynapse, {\n  MarkdownSynapseProps,\n} from '../Markdown/MarkdownSynapse'\nimport WikiMarkdownEditor from '../WikiMarkdownEditor/WikiMarkdownEditor'\n\nexport const ERROR_LOADING_WIKI_FAILED = 'Failed to load the wiki page: '\nexport const DEFAULT_BUTTON_TEXT = 'Edit Wiki Page'\nconst DEFAULT_BUTTON_PROPS: Omit<ButtonProps, 'onClick'> = {\n  children: DEFAULT_BUTTON_TEXT,\n  color: 'primary',\n  variant: 'contained',\n}\n\nexport type WikiMarkdownEditorButtonProps = {\n  ownerObjectType: ObjectType\n  ownerObjectId: string\n  // if wikiPageId is undefined, will get (or create) the root WikiPage for this ownerObject\n  // otherwise, will get the WikiPage with the specified wikiPageId\n  wikiPageId?: string\n  buttonProps?: Omit<ButtonProps, 'onClick' | 'disabled'>\n  displayWikiMarkdown?: boolean\n}\n\nexport function WikiMarkdownEditorButton(props: WikiMarkdownEditorButtonProps) {\n  const {\n    ownerObjectType,\n    ownerObjectId,\n    wikiPageId: initialWikiPageId,\n    displayWikiMarkdown = false,\n  } = props\n\n  const buttonProps: Omit<ButtonProps, 'onClick' | 'disabled'> = defaults(\n    {},\n    props.buttonProps,\n    DEFAULT_BUTTON_PROPS,\n  )\n\n  const [open, setOpen] = useState<boolean>(false)\n\n  const {\n    data: rootWikiPageKey,\n    isLoading: isLoadingRootWikiPageKey,\n    error: errorLoadingRootWikiPageKey,\n  } = useGetRootWikiPageKey(ownerObjectType, ownerObjectId, {\n    enabled: initialWikiPageId === undefined,\n  })\n\n  const {\n    mutate: createWikiPage,\n    isPending: isCreatingWikiPage,\n    error: errorCreatingWikiPage,\n  } = useCreateWikiPage({\n    onSuccess: () => setOpen(true),\n  })\n\n  const wikiPageKey = useMemo(() => {\n    const wikiPageId = initialWikiPageId || rootWikiPageKey?.wikiPageId || ''\n    const wikiPageKey: WikiPageKey = {\n      ownerObjectType,\n      ownerObjectId,\n      wikiPageId: wikiPageId,\n    }\n    return wikiPageKey\n  }, [initialWikiPageId, rootWikiPageKey, ownerObjectId, ownerObjectType])\n\n  const {\n    data: wikiPage,\n    isLoading: isLoadingWikiPage,\n    error: errorLoadingWikiPage,\n  } = useGetWikiPage(wikiPageKey, {\n    enabled: wikiPageKey.wikiPageId !== '',\n    // Set staleTime to infinity to prevent re-fetching while editing\n    staleTime: Infinity,\n  })\n\n  const error = useMemo(() => {\n    if (errorLoadingRootWikiPageKey) {\n      return ERROR_LOADING_WIKI_FAILED + errorLoadingRootWikiPageKey.reason\n    }\n    if (errorLoadingWikiPage) {\n      return ERROR_LOADING_WIKI_FAILED + errorLoadingWikiPage.reason\n    }\n    if (errorCreatingWikiPage) {\n      return errorCreatingWikiPage.reason\n    }\n    return null\n  }, [errorLoadingRootWikiPageKey, errorLoadingWikiPage, errorCreatingWikiPage])\n\n  const handleClick = () => {\n    if (wikiPage) {\n      setOpen(true)\n    } else if (rootWikiPageKey === null) {\n      // root WikiPageKey was not found,\n      // then create a root WikiPage for this ownerObject\n      const rootWikiPage: CreateWikiPageInput['wikiPage'] = {\n        parentWikiId: undefined,\n        title: '',\n        markdown: '',\n        attachmentFileHandleIds: [],\n      }\n      const input: CreateWikiPageInput = {\n        ownerObjectId,\n        ownerObjectType,\n        wikiPage: rootWikiPage,\n      }\n      createWikiPage(input)\n    } else {\n      // Should only reach this block if there was:\n      //  - a non-404 error fetching the root WikiPageKey\n      //  - an error fetching a specific wikiPage\n      // Otherwise the button should be disabled.\n      console.warn(\n        'There was an error fetching the root WikiPageKey or WikiPage - address that error first.',\n      )\n    }\n  }\n\n  /* TODO - pass ownerId, objectType, wikiId directly to MarkdownSynapse after \n  MarkdownSynapse is updated to fetch root WikiPages for ACCESS_REQUIREMENT object types.\n  See https://sagebionetworks.jira.com/browse/SWC-6791. */\n  const markdownSynapseProps = useMemo(() => {\n    const markdownSynapseProps: MarkdownSynapseProps = {\n      showPlaceholderIfNoWikiContent: true,\n    }\n    if (wikiPage) {\n      return {\n        ...markdownSynapseProps,\n        ownerId: ownerObjectId,\n        objectType: ownerObjectType,\n        wikiId: wikiPage.id,\n      }\n    } else {\n      // use a placeholder value for markdown so that MarkdownSynapse\n      // displays no content placeholder for owners without root wiki pages\n      return { ...markdownSynapseProps, markdown: '' }\n    }\n  }, [ownerObjectId, ownerObjectType, wikiPage])\n\n  return (\n    <>\n      {displayWikiMarkdown && (\n        <Box\n          sx={{\n            mb: 1,\n          }}\n        >\n          {isLoadingWikiPage || isLoadingRootWikiPageKey ? (\n            <SynapseSpinner />\n          ) : (\n            // TODO - remove key once MarkdownSynapse uses tanstack-query\n            <MarkdownSynapse\n              key={wikiPage?.markdown}\n              {...markdownSynapseProps}\n            />\n          )}\n        </Box>\n      )}\n      <Button\n        onClick={handleClick}\n        disabled={\n          isLoadingWikiPage || isLoadingRootWikiPageKey || isCreatingWikiPage\n        }\n        {...buttonProps}\n      />\n      {error && (\n        <Alert severity=\"error\" sx={{ marginTop: 2 }}>\n          {error}\n        </Alert>\n      )}\n      {wikiPage && (\n        <WikiMarkdownEditor\n          // Specify a key so that uncommitted changes in WikiMarkdownEditor\n          // are not displayed when editor is re-opened\n          key={open.toString()}\n          open={open}\n          ownerObjectType={ownerObjectType}\n          ownerObjectId={ownerObjectId}\n          wikiPage={wikiPage}\n          onSave={() => setOpen(false)}\n          onCancel={() => setOpen(false)}\n        />\n      )}\n    </>\n  )\n}\n\nexport default WikiMarkdownEditorButton\n"],"mappings":";;;;;;;;;;AAgBA,IAAa,IAA4B,kCAC5B,IAAsB,kBAC7B,IAAqD;CACzD,UAAU;CACV,OAAO;CACP,SAAS;CACV;AAYD,SAAgB,EAAyB,GAAsC;CAC7E,IAAM,EACJ,oBACA,kBACA,YAAY,GACZ,yBAAsB,OACpB,GAEE,IAAyD,EAC7D,EAAE,EACF,EAAM,aACN,EACD,EAEK,CAAC,GAAM,KAAW,EAAkB,GAAM,EAE1C,EACJ,MAAM,GACN,WAAW,GACX,OAAO,MACL,EAAsB,GAAiB,GAAe,EACxD,SAAS,MAAsB,KAAA,GAChC,CAAC,EAEI,EACJ,QAAQ,GACR,WAAW,GACX,OAAO,MACL,EAAkB,EACpB,iBAAiB,EAAQ,GAAK,EAC/B,CAAC,EAEI,IAAc,SAEe;EAC/B;EACA;EACY,YAJK,KAAqB,GAAiB,cAAc;EAKtE,GAEA;EAAC;EAAmB;EAAiB;EAAe;EAAgB,CAAC,EAElE,EACJ,MAAM,GACN,WAAW,GACX,OAAO,MACL,EAAe,GAAa;EAC9B,SAAS,EAAY,eAAe;EAEpC,WAAW;EACZ,CAAC,EAEI,IAAQ,QACR,IACK,IAA4B,EAA4B,SAE7D,IACK,IAA4B,EAAqB,SAEtD,IACK,EAAsB,SAExB,MACN;EAAC;EAA6B;EAAsB;EAAsB,CAAC,EAExE,UAAoB;AACxB,EAAI,IACF,EAAQ,GAAK,GACJ,MAAoB,OAc7B,EALmC;GACjC;GACA;GACA,UAToD;IACpD,cAAc,KAAA;IACd,OAAO;IACP,UAAU;IACV,yBAAyB,EAAE;IAC5B;GAKA,CACoB,GAMrB,QAAQ,KACN,2FACD;IAOC,IAAuB,QAAc;EACzC,IAAM,IAA6C,EACjD,gCAAgC,IACjC;AAWC,SAVE,IACK;GACL,GAAG;GACH,SAAS;GACT,YAAY;GACZ,QAAQ,EAAS;GAClB,GAIM;GAAE,GAAG;GAAsB,UAAU;GAAI;IAEjD;EAAC;EAAe;EAAiB;EAAS,CAAC;AAE9C,QACE,kBAAA,GAAA,EAAA,UAAA;EACG,KACC,kBAAC,GAAD;GACE,IAAI,EACF,IAAI,GACL;aAEA,KAAqB,IACpB,kBAAC,GAAD,EAAkB,CAAA,GAGlB,kBAAC,GAAD,EAEE,GAAI,GACJ,EAFK,GAAU,SAEf;GAEA,CAAA;EAER,kBAAC,GAAD;GACE,SAAS;GACT,UACE,KAAqB,KAA4B;GAEnD,GAAI;GACJ,CAAA;EACD,KACC,kBAAC,GAAD;GAAO,UAAS;GAAQ,IAAI,EAAE,WAAW,GAAG;aACzC;GACK,CAAA;EAET,KACC,kBAAC,GAAD;GAIQ;GACW;GACF;GACL;GACV,cAAc,EAAQ,GAAM;GAC5B,gBAAgB,EAAQ,GAAM;GAC9B,EAPK,EAAK,UAAU,CAOpB;EAEH,EAAA,CAAA"}
+{"version":3,"file":"WikiMarkdownEditorButton.js","names":[],"sources":["../../../src/components/WikiMarkdownEditorButton/WikiMarkdownEditorButton.tsx"],"sourcesContent":["import {\n  CreateWikiPageInput,\n  useCreateWikiPage,\n  useGetRootWikiPageKey,\n  useGetWikiPage,\n} from '@/synapse-queries'\nimport { Alert, Box, Button, ButtonProps } from '@mui/material'\nimport { ObjectType, WikiPageKey } from '@sage-bionetworks/synapse-types'\nimport { defaults } from 'lodash-es'\nimport { useMemo, useState } from 'react'\nimport { SynapseSpinner } from '../LoadingScreen/LoadingScreen'\nimport MarkdownSynapse, {\n  MarkdownSynapseProps,\n} from '../Markdown/MarkdownSynapse'\nimport WikiMarkdownEditor from '../WikiMarkdownEditor/WikiMarkdownEditor'\n\nexport const ERROR_LOADING_WIKI_FAILED = 'Failed to load the wiki page: '\nexport const DEFAULT_BUTTON_TEXT = 'Edit Wiki Page'\nconst DEFAULT_BUTTON_PROPS: Omit<ButtonProps, 'onClick'> = {\n  children: DEFAULT_BUTTON_TEXT,\n  color: 'primary',\n  variant: 'contained',\n}\n\nexport type WikiMarkdownEditorButtonProps = {\n  ownerObjectType: ObjectType\n  ownerObjectId: string\n  // if wikiPageId is undefined, will get (or create) the root WikiPage for this ownerObject\n  // otherwise, will get the WikiPage with the specified wikiPageId\n  wikiPageId?: string\n  buttonProps?: Omit<ButtonProps, 'onClick' | 'disabled'>\n  displayWikiMarkdown?: boolean\n}\n\nexport function WikiMarkdownEditorButton(props: WikiMarkdownEditorButtonProps) {\n  const {\n    ownerObjectType,\n    ownerObjectId,\n    wikiPageId: initialWikiPageId,\n    displayWikiMarkdown = false,\n  } = props\n\n  const buttonProps: Omit<ButtonProps, 'onClick' | 'disabled'> = defaults(\n    {},\n    props.buttonProps,\n    DEFAULT_BUTTON_PROPS,\n  )\n\n  const [open, setOpen] = useState<boolean>(false)\n\n  const {\n    data: rootWikiPageKey,\n    isLoading: isLoadingRootWikiPageKey,\n    error: errorLoadingRootWikiPageKey,\n  } = useGetRootWikiPageKey(ownerObjectType, ownerObjectId, {\n    enabled: initialWikiPageId === undefined,\n  })\n\n  const {\n    mutate: createWikiPage,\n    isPending: isCreatingWikiPage,\n    error: errorCreatingWikiPage,\n  } = useCreateWikiPage({\n    onSuccess: () => setOpen(true),\n  })\n\n  const wikiPageKey = useMemo(() => {\n    const wikiPageId = initialWikiPageId || rootWikiPageKey?.wikiPageId || ''\n    const wikiPageKey: WikiPageKey = {\n      ownerObjectType,\n      ownerObjectId,\n      wikiPageId: wikiPageId,\n    }\n    return wikiPageKey\n  }, [initialWikiPageId, rootWikiPageKey, ownerObjectId, ownerObjectType])\n\n  const {\n    data: wikiPage,\n    isLoading: isLoadingWikiPage,\n    error: errorLoadingWikiPage,\n  } = useGetWikiPage(wikiPageKey, {\n    enabled: wikiPageKey.wikiPageId !== '',\n    // Set staleTime to infinity to prevent re-fetching while editing\n    staleTime: Infinity,\n  })\n\n  const error = useMemo(() => {\n    if (errorLoadingRootWikiPageKey) {\n      return ERROR_LOADING_WIKI_FAILED + errorLoadingRootWikiPageKey.reason\n    }\n    if (errorLoadingWikiPage) {\n      return ERROR_LOADING_WIKI_FAILED + errorLoadingWikiPage.reason\n    }\n    if (errorCreatingWikiPage) {\n      return errorCreatingWikiPage.reason\n    }\n    return null\n  }, [errorLoadingRootWikiPageKey, errorLoadingWikiPage, errorCreatingWikiPage])\n\n  const handleClick = () => {\n    if (wikiPage) {\n      setOpen(true)\n    } else if (rootWikiPageKey === null) {\n      // root WikiPageKey was not found,\n      // then create a root WikiPage for this ownerObject\n      const rootWikiPage: CreateWikiPageInput['wikiPage'] = {\n        parentWikiId: undefined,\n        title: '',\n        markdown: '',\n        attachmentFileHandleIds: [],\n      }\n      const input: CreateWikiPageInput = {\n        ownerObjectId,\n        ownerObjectType,\n        wikiPage: rootWikiPage,\n      }\n      createWikiPage(input)\n    } else {\n      // Should only reach this block if there was:\n      //  - a non-404 error fetching the root WikiPageKey\n      //  - an error fetching a specific wikiPage\n      // Otherwise the button should be disabled.\n      console.warn(\n        'There was an error fetching the root WikiPageKey or WikiPage - address that error first.',\n      )\n    }\n  }\n\n  /* TODO - pass ownerId, objectType, wikiId directly to MarkdownSynapse after \n  MarkdownSynapse is updated to fetch root WikiPages for ACCESS_REQUIREMENT object types.\n  See https://sagebionetworks.jira.com/browse/SWC-6791. */\n  const markdownSynapseProps = useMemo(() => {\n    const markdownSynapseProps: MarkdownSynapseProps = {\n      showPlaceholderIfNoWikiContent: true,\n    }\n    if (wikiPage) {\n      return {\n        ...markdownSynapseProps,\n        ownerId: ownerObjectId,\n        objectType: ownerObjectType,\n        wikiId: wikiPage.id,\n      }\n    } else {\n      // use a placeholder value for markdown so that MarkdownSynapse\n      // displays no content placeholder for owners without root wiki pages\n      return { ...markdownSynapseProps, markdown: '' }\n    }\n  }, [ownerObjectId, ownerObjectType, wikiPage])\n\n  return (\n    <>\n      {displayWikiMarkdown && (\n        <Box\n          sx={{\n            mb: 1,\n          }}\n        >\n          {isLoadingWikiPage || isLoadingRootWikiPageKey ? (\n            <SynapseSpinner />\n          ) : (\n            // TODO - remove key once MarkdownSynapse uses tanstack-query\n            <MarkdownSynapse\n              key={wikiPage?.markdown}\n              {...markdownSynapseProps}\n            />\n          )}\n        </Box>\n      )}\n      <Button\n        onClick={handleClick}\n        disabled={\n          isLoadingWikiPage || isLoadingRootWikiPageKey || isCreatingWikiPage\n        }\n        {...buttonProps}\n      />\n      {error && (\n        <Alert severity=\"error\" sx={{ marginTop: 2 }}>\n          {error}\n        </Alert>\n      )}\n      {wikiPage && (\n        <WikiMarkdownEditor\n          // Specify a key so that uncommitted changes in WikiMarkdownEditor\n          // are not displayed when editor is re-opened\n          key={open.toString()}\n          open={open}\n          ownerObjectType={ownerObjectType}\n          ownerObjectId={ownerObjectId}\n          wikiPage={wikiPage}\n          onSave={() => setOpen(false)}\n          onCancel={() => setOpen(false)}\n        />\n      )}\n    </>\n  )\n}\n\nexport default WikiMarkdownEditorButton\n"],"mappings":";;;;;;;;;;AAgBA,IAAa,IAA4B,kCAC5B,IAAsB,kBAC7B,IAAqD;CACzD,UAAU;CACV,OAAO;CACP,SAAS;CACV;AAYD,SAAgB,EAAyB,GAAsC;CAC7E,IAAM,EACJ,oBACA,kBACA,YAAY,GACZ,yBAAsB,OACpB,GAEE,IAAyD,EAC7D,EAAE,EACF,EAAM,aACN,EACD,EAEK,CAAC,GAAM,KAAW,EAAkB,GAAM,EAE1C,EACJ,MAAM,GACN,WAAW,GACX,OAAO,MACL,EAAsB,GAAiB,GAAe,EACxD,SAAS,MAAsB,KAAA,GAChC,CAAC,EAEI,EACJ,QAAQ,GACR,WAAW,GACX,OAAO,MACL,EAAkB,EACpB,iBAAiB,EAAQ,GAAK,EAC/B,CAAC,EAEI,IAAc,SAOX;EAJL;EACA;EACY,YAJK,KAAqB,GAAiB,cAAc;EAMhE,GACN;EAAC;EAAmB;EAAiB;EAAe;EAAgB,CAAC,EAElE,EACJ,MAAM,GACN,WAAW,GACX,OAAO,MACL,EAAe,GAAa;EAC9B,SAAS,EAAY,eAAe;EAEpC,WAAW;EACZ,CAAC,EAEI,IAAQ,QACR,IACK,IAA4B,EAA4B,SAE7D,IACK,IAA4B,EAAqB,SAEtD,IACK,EAAsB,SAExB,MACN;EAAC;EAA6B;EAAsB;EAAsB,CAAC,EAExE,UAAoB;AACxB,EAAI,IACF,EAAQ,GAAK,GACJ,MAAoB,OAc7B,EAAe;GAJb;GACA;GACA,UAAU;IARV,cAAc,KAAA;IACd,OAAO;IACP,UAAU;IACV,yBAAyB,EAAE;IAKjB;GAEG,CAAM,GAMrB,QAAQ,KACN,2FACD;IAOC,IAAuB,QAAc;EACzC,IAAM,IAA6C,EACjD,gCAAgC,IACjC;AAWC,SAVE,IACK;GACL,GAAG;GACH,SAAS;GACT,YAAY;GACZ,QAAQ,EAAS;GAClB,GAIM;GAAE,GAAG;GAAsB,UAAU;GAAI;IAEjD;EAAC;EAAe;EAAiB;EAAS,CAAC;AAE9C,QACE,kBAAA,GAAA,EAAA,UAAA;EACG,KACC,kBAAC,GAAD;GACE,IAAI,EACF,IAAI,GACL;aAEA,KAAqB,IACpB,kBAAC,GAAD,EAAkB,CAAA,GAGlB,kBAAC,GAAD,EAEE,GAAI,GACJ,EAFK,GAAU,SAEf;GAEA,CAAA;EAER,kBAAC,GAAD;GACE,SAAS;GACT,UACE,KAAqB,KAA4B;GAEnD,GAAI;GACJ,CAAA;EACD,KACC,kBAAC,GAAD;GAAO,UAAS;GAAQ,IAAI,EAAE,WAAW,GAAG;aACzC;GACK,CAAA;EAET,KACC,kBAAC,GAAD;GAIQ;GACW;GACF;GACL;GACV,cAAc,EAAQ,GAAM;GAC5B,gBAAgB,EAAQ,GAAM;GAC9B,EAPK,EAAK,UAAU,CAOpB;EAEH,EAAA,CAAA"}

package/dist/components/dataaccess/AccessApprovalsTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccessApprovalsTable.js","names":[],"sources":["../../../src/components/dataaccess/AccessApprovalsTable.tsx"],"sourcesContent":["import InfiniteTableLayout from '@/components/layout/InfiniteTableLayout'\nimport { useSearchAccessApprovalsInfinite } from '@/synapse-queries/dataaccess/useAccessApprovals'\nimport { formatDate } from '@/utils/functions/DateFormatter'\nimport { PRODUCTION_ENDPOINT_CONFIG } from '@/utils/functions/getEndpoint'\nimport {\n  AccessApprovalSearchRequest,\n  AccessApprovalSearchResult,\n  AccessApprovalSearchSort,\n  AccessApprovalSortField,\n  Direction,\n} from '@sage-bionetworks/synapse-types'\nimport {\n  createColumnHelper,\n  getCoreRowModel,\n  SortingState,\n  useReactTable,\n} from '@tanstack/react-table'\nimport dayjs from 'dayjs'\nimport { upperFirst } from 'lodash-es'\nimport { useMemo, useState } from 'react'\nimport ColumnHeader from '../TanStackTable/ColumnHeader'\nimport StyledTanStackTable from '../TanStackTable/StyledTanStackTable'\nimport UserOrTeamBadge from '../UserOrTeamBadge/index'\n\nconst columnHelper = createColumnHelper<AccessApprovalSearchResult>()\nconst columns = [\n  columnHelper.accessor('accessRequirementId', {\n    header: props => <ColumnHeader {...props} title={'AR ID'} />,\n    enableSorting: false,\n    cell: ctx => (\n      <a\n        href={`${\n          PRODUCTION_ENDPOINT_CONFIG.PORTAL\n        }AccessRequirement:AR_ID=${ctx.getValue()}`}\n        target={'_blank'}\n      >\n        {ctx.getValue()}\n      </a>\n    ),\n  }),\n  columnHelper.accessor('accessRequirementName', {\n    header: props => (\n      <ColumnHeader {...props} title={'Access Requirement Name'} />\n    ),\n    enableSorting: false,\n  }),\n  columnHelper.accessor('submitterId', {\n    header: props => <ColumnHeader {...props} title={'Submitter'} />,\n    enableSorting: false,\n    cell: ctx => <UserOrTeamBadge principalId={ctx.getValue()} />,\n  }),\n  columnHelper.accessor('state', {\n    header: props => <ColumnHeader {...props} title={'Status'} />,\n    enableSorting: false,\n    cell: ctx => upperFirst(ctx.getValue().toLocaleLowerCase()),\n  }),\n  columnHelper.accessor('modifiedOn', {\n    header: props => <ColumnHeader {...props} title={'Modified Date'} />,\n    enableSorting: true,\n    cell: ctx => formatDate(dayjs(ctx.getValue())),\n  }),\n  columnHelper.accessor('expiredOn', {\n    header: props => <ColumnHeader {...props} title={'Expires'} />,\n    enableSorting: true,\n    cell: ctx => (\n      <span\n        className={`${\n          ctx.getValue()\n            ? new Date() > new Date(ctx.getValue())\n              ? 'expired'\n              : ''\n            : 'non-expire'\n        } remove-border`}\n      >\n        {ctx.getValue() ? formatDate(dayjs(ctx.getValue())) : 'Never'}\n      </span>\n    ),\n  }),\n]\n\nfunction getSortApiRequestFromTableSortState(\n  sortingState: SortingState,\n): AccessApprovalSearchSort[] | undefined {\n  if (sortingState.length === 0) {\n    return undefined\n  }\n  const sort = sortingState[0]\n  let field: AccessApprovalSortField = AccessApprovalSortField.MODIFIED_ON\n  if (sort.id === 'modifiedOn') {\n    field = AccessApprovalSortField.MODIFIED_ON\n  } else if (sort.id === 'expiredOn') {\n    field = AccessApprovalSortField.EXPIRED_ON\n  }\n  return [\n    {\n      field,\n      direction: sort.desc ? Direction.DESC : Direction.ASC,\n    },\n  ]\n}\n\nexport type AccessApprovalsTableProps = {\n  accessorId: string\n  accessRequirementId?: string\n}\nexport function AccessApprovalsTable({\n  accessorId,\n  accessRequirementId,\n}: AccessApprovalsTableProps) {\n  const [tableSortState, setTableSortState] = useState<SortingState>([\n    {\n      desc: true,\n      id: 'modifiedOn',\n    },\n  ])\n\n  const searchRequest: AccessApprovalSearchRequest = useMemo(\n    () => ({\n      accessorId,\n      accessRequirementId,\n      sort: getSortApiRequestFromTableSortState(tableSortState),\n    }),\n    [accessorId, accessRequirementId, tableSortState],\n  )\n\n  const { data, hasNextPage, fetchNextPage, isLoading, isFetchingNextPage } =\n    useSearchAccessApprovalsInfinite(searchRequest)\n  const accessApprovals = useMemo(\n    () => data?.pages.flatMap(page => page.results) ?? [],\n    [data?.pages],\n  )\n\n  const table = useReactTable<AccessApprovalSearchResult>({\n    data: accessApprovals,\n    columns: columns,\n    getCoreRowModel: getCoreRowModel(),\n    manualSorting: true,\n    onSortingChange: setTableSortState,\n    state: {\n      sorting: tableSortState,\n    },\n    columnResizeMode: 'onChange',\n  })\n\n  const isEmpty = !isLoading && table.getRowModel().rows.length === 0\n\n  return (\n    <div className=\"AccessApprovalsTable\">\n      <InfiniteTableLayout\n        table={<StyledTanStackTable table={table} />}\n        isLoading={isLoading}\n        isEmpty={isEmpty}\n        hasNextPage={hasNextPage}\n        onFetchNextPageClicked={() => {\n          void fetchNextPage()\n        }}\n        isFetchingNextPage={isFetchingNextPage}\n      />\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;AAwBA,IAAM,IAAe,GAAgD,EAC/D,IAAU;CACd,EAAa,SAAS,uBAAuB;EAC3C,SAAQ,MAAS,kBAAC,GAAD;GAAc,GAAI;GAAO,OAAO;GAAW,CAAA;EAC5D,eAAe;EACf,OAAM,MACJ,kBAAC,KAAD;GACE,MAAM,GACJ,EAA2B,OAC5B,0BAA0B,EAAI,UAAU;GACzC,QAAQ;aAEP,EAAI,UAAU;GACb,CAAA;EAEP,CAAC;CACF,EAAa,SAAS,yBAAyB;EAC7C,SAAQ,MACN,kBAAC,GAAD;GAAc,GAAI;GAAO,OAAO;GAA6B,CAAA;EAE/D,eAAe;EAChB,CAAC;CACF,EAAa,SAAS,eAAe;EACnC,SAAQ,MAAS,kBAAC,GAAD;GAAc,GAAI;GAAO,OAAO;GAAe,CAAA;EAChE,eAAe;EACf,OAAM,MAAO,kBAAC,GAAD,EAAiB,aAAa,EAAI,UAAU,EAAI,CAAA;EAC9D,CAAC;CACF,EAAa,SAAS,SAAS;EAC7B,SAAQ,MAAS,kBAAC,GAAD;GAAc,GAAI;GAAO,OAAO;GAAY,CAAA;EAC7D,eAAe;EACf,OAAM,MAAO,EAAW,EAAI,UAAU,CAAC,mBAAmB,CAAC;EAC5D,CAAC;CACF,EAAa,SAAS,cAAc;EAClC,SAAQ,MAAS,kBAAC,GAAD;GAAc,GAAI;GAAO,OAAO;GAAmB,CAAA;EACpE,eAAe;EACf,OAAM,MAAO,EAAW,EAAM,EAAI,UAAU,CAAC,CAAC;EAC/C,CAAC;CACF,EAAa,SAAS,aAAa;EACjC,SAAQ,MAAS,kBAAC,GAAD;GAAc,GAAI;GAAO,OAAO;GAAa,CAAA;EAC9D,eAAe;EACf,OAAM,MACJ,kBAAC,QAAD;GACE,WAAW,GACT,EAAI,UAAU,mBACV,IAAI,MAAM,GAAG,IAAI,KAAK,EAAI,UAAU,CAAC,GACnC,YACA,KACF,aACL;aAEA,EAAI,UAAU,GAAG,EAAW,EAAM,EAAI,UAAU,CAAC,CAAC,GAAG;GACjD,CAAA;EAEV,CAAC;CACH;AAED,SAAS,EACP,GACwC;AACxC,KAAI,EAAa,WAAW,EAC1B;CAEF,IAAM,IAAO,EAAa,IACtB,IAAiC,EAAwB;AAM7D,QALI,EAAK,OAAO,eACd,IAAQ,EAAwB,cACvB,EAAK,OAAO,gBACrB,IAAQ,EAAwB,aAE3B,CACL;EACE;EACA,WAAW,EAAK,OAAO,EAAU,OAAO,EAAU;EACnD,CACF;;AAOH,SAAgB,EAAqB,EACnC,eACA,0BAC4B;CAC5B,IAAM,CAAC,GAAgB,KAAqB,EAAuB,CACjE;EACE,MAAM;EACN,IAAI;EACL,CACF,CAAC,EAWI,EAAE,SAAM,gBAAa,kBAAe,cAAW,0BACnD,EAViD,SAC1C;EACL;EACA;EACA,MAAM,EAAoC,EAAe;EAC1D,GACD;EAAC;EAAY;EAAqB;EAAe,CAClD,CAGgD,EAM3C,IAAQ,EAA0C;EACtD,MANsB,QAChB,GAAM,MAAM,SAAQ,MAAQ,EAAK,QAAQ,IAAI,EAAE,EACrD,CAAC,GAAM,MAAM,CACd;EAIU;EACT,iBAAiB,GAAiB;EAClC,eAAe;EACf,iBAAiB;EACjB,OAAO,EACL,SAAS,GACV;EACD,kBAAkB;EACnB,CAAC,EAEI,IAAU,CAAC,KAAa,EAAM,aAAa,CAAC,KAAK,WAAW;AAElE,QACE,kBAAC,OAAD;EAAK,WAAU;YACb,kBAAC,GAAD;GACE,OAAO,kBAAC,GAAD,EAA4B,UAAS,CAAA;GACjC;GACF;GACI;GACb,8BAA8B;AACvB,OAAe;;GAEF;GACpB,CAAA;EACE,CAAA"}
+{"version":3,"file":"AccessApprovalsTable.js","names":[],"sources":["../../../src/components/dataaccess/AccessApprovalsTable.tsx"],"sourcesContent":["import InfiniteTableLayout from '@/components/layout/InfiniteTableLayout'\nimport { useSearchAccessApprovalsInfinite } from '@/synapse-queries/dataaccess/useAccessApprovals'\nimport { formatDate } from '@/utils/functions/DateFormatter'\nimport { PRODUCTION_ENDPOINT_CONFIG } from '@/utils/functions/getEndpoint'\nimport {\n  AccessApprovalSearchRequest,\n  AccessApprovalSearchResult,\n  AccessApprovalSearchSort,\n  AccessApprovalSortField,\n  Direction,\n} from '@sage-bionetworks/synapse-types'\nimport {\n  createColumnHelper,\n  getCoreRowModel,\n  SortingState,\n  useReactTable,\n} from '@tanstack/react-table'\nimport dayjs from 'dayjs'\nimport { upperFirst } from 'lodash-es'\nimport { useMemo, useState } from 'react'\nimport ColumnHeader from '../TanStackTable/ColumnHeader'\nimport StyledTanStackTable from '../TanStackTable/StyledTanStackTable'\nimport UserOrTeamBadge from '../UserOrTeamBadge/index'\n\nconst columnHelper = createColumnHelper<AccessApprovalSearchResult>()\nconst columns = [\n  columnHelper.accessor('accessRequirementId', {\n    header: props => <ColumnHeader {...props} title={'AR ID'} />,\n    enableSorting: false,\n    cell: ctx => (\n      <a\n        href={`${\n          PRODUCTION_ENDPOINT_CONFIG.PORTAL\n        }AccessRequirement:AR_ID=${ctx.getValue()}`}\n        target={'_blank'}\n      >\n        {ctx.getValue()}\n      </a>\n    ),\n  }),\n  columnHelper.accessor('accessRequirementName', {\n    header: props => (\n      <ColumnHeader {...props} title={'Access Requirement Name'} />\n    ),\n    enableSorting: false,\n  }),\n  columnHelper.accessor('submitterId', {\n    header: props => <ColumnHeader {...props} title={'Submitter'} />,\n    enableSorting: false,\n    cell: ctx => <UserOrTeamBadge principalId={ctx.getValue()} />,\n  }),\n  columnHelper.accessor('state', {\n    header: props => <ColumnHeader {...props} title={'Status'} />,\n    enableSorting: false,\n    cell: ctx => upperFirst(ctx.getValue().toLocaleLowerCase()),\n  }),\n  columnHelper.accessor('modifiedOn', {\n    header: props => <ColumnHeader {...props} title={'Modified Date'} />,\n    enableSorting: true,\n    cell: ctx => formatDate(dayjs(ctx.getValue())),\n  }),\n  columnHelper.accessor('expiredOn', {\n    header: props => <ColumnHeader {...props} title={'Expires'} />,\n    enableSorting: true,\n    cell: ctx => (\n      <span\n        className={`${\n          ctx.getValue()\n            ? new Date() > new Date(ctx.getValue())\n              ? 'expired'\n              : ''\n            : 'non-expire'\n        } remove-border`}\n      >\n        {ctx.getValue() ? formatDate(dayjs(ctx.getValue())) : 'Never'}\n      </span>\n    ),\n  }),\n]\n\nfunction getSortApiRequestFromTableSortState(\n  sortingState: SortingState,\n): AccessApprovalSearchSort[] | undefined {\n  if (sortingState.length === 0) {\n    return undefined\n  }\n  const sort = sortingState[0]\n  let field: AccessApprovalSortField = AccessApprovalSortField.MODIFIED_ON\n  if (sort.id === 'modifiedOn') {\n    field = AccessApprovalSortField.MODIFIED_ON\n  } else if (sort.id === 'expiredOn') {\n    field = AccessApprovalSortField.EXPIRED_ON\n  }\n  return [\n    {\n      field,\n      direction: sort.desc ? Direction.DESC : Direction.ASC,\n    },\n  ]\n}\n\nexport type AccessApprovalsTableProps = {\n  accessorId: string\n  accessRequirementId?: string\n}\nexport function AccessApprovalsTable({\n  accessorId,\n  accessRequirementId,\n}: AccessApprovalsTableProps) {\n  const [tableSortState, setTableSortState] = useState<SortingState>([\n    {\n      desc: true,\n      id: 'modifiedOn',\n    },\n  ])\n\n  const searchRequest: AccessApprovalSearchRequest = useMemo(\n    () => ({\n      accessorId,\n      accessRequirementId,\n      sort: getSortApiRequestFromTableSortState(tableSortState),\n    }),\n    [accessorId, accessRequirementId, tableSortState],\n  )\n\n  const { data, hasNextPage, fetchNextPage, isLoading, isFetchingNextPage } =\n    useSearchAccessApprovalsInfinite(searchRequest)\n  const accessApprovals = useMemo(\n    () => data?.pages.flatMap(page => page.results) ?? [],\n    [data?.pages],\n  )\n\n  const table = useReactTable<AccessApprovalSearchResult>({\n    data: accessApprovals,\n    columns: columns,\n    getCoreRowModel: getCoreRowModel(),\n    manualSorting: true,\n    onSortingChange: setTableSortState,\n    state: {\n      sorting: tableSortState,\n    },\n    columnResizeMode: 'onChange',\n  })\n\n  const isEmpty = !isLoading && table.getRowModel().rows.length === 0\n\n  return (\n    <div className=\"AccessApprovalsTable\">\n      <InfiniteTableLayout\n        table={<StyledTanStackTable table={table} />}\n        isLoading={isLoading}\n        isEmpty={isEmpty}\n        hasNextPage={hasNextPage}\n        onFetchNextPageClicked={() => {\n          void fetchNextPage()\n        }}\n        isFetchingNextPage={isFetchingNextPage}\n      />\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;AAwBA,IAAM,IAAe,GAAgD,EAC/D,IAAU;CACd,EAAa,SAAS,uBAAuB;EAC3C,SAAQ,MAAS,kBAAC,GAAD;GAAc,GAAI;GAAO,OAAO;GAAW,CAAA;EAC5D,eAAe;EACf,OAAM,MACJ,kBAAC,KAAD;GACE,MAAM,GACJ,EAA2B,OAC5B,0BAA0B,EAAI,UAAU;GACzC,QAAQ;aAEP,EAAI,UAAU;GACb,CAAA;EAEP,CAAC;CACF,EAAa,SAAS,yBAAyB;EAC7C,SAAQ,MACN,kBAAC,GAAD;GAAc,GAAI;GAAO,OAAO;GAA6B,CAAA;EAE/D,eAAe;EAChB,CAAC;CACF,EAAa,SAAS,eAAe;EACnC,SAAQ,MAAS,kBAAC,GAAD;GAAc,GAAI;GAAO,OAAO;GAAe,CAAA;EAChE,eAAe;EACf,OAAM,MAAO,kBAAC,GAAD,EAAiB,aAAa,EAAI,UAAU,EAAI,CAAA;EAC9D,CAAC;CACF,EAAa,SAAS,SAAS;EAC7B,SAAQ,MAAS,kBAAC,GAAD;GAAc,GAAI;GAAO,OAAO;GAAY,CAAA;EAC7D,eAAe;EACf,OAAM,MAAO,EAAW,EAAI,UAAU,CAAC,mBAAmB,CAAC;EAC5D,CAAC;CACF,EAAa,SAAS,cAAc;EAClC,SAAQ,MAAS,kBAAC,GAAD;GAAc,GAAI;GAAO,OAAO;GAAmB,CAAA;EACpE,eAAe;EACf,OAAM,MAAO,EAAW,EAAM,EAAI,UAAU,CAAC,CAAC;EAC/C,CAAC;CACF,EAAa,SAAS,aAAa;EACjC,SAAQ,MAAS,kBAAC,GAAD;GAAc,GAAI;GAAO,OAAO;GAAa,CAAA;EAC9D,eAAe;EACf,OAAM,MACJ,kBAAC,QAAD;GACE,WAAW,GACT,EAAI,UAAU,mBACV,IAAI,MAAM,GAAG,IAAI,KAAK,EAAI,UAAU,CAAC,GACnC,YACA,KACF,aACL;aAEA,EAAI,UAAU,GAAG,EAAW,EAAM,EAAI,UAAU,CAAC,CAAC,GAAG;GACjD,CAAA;EAEV,CAAC;CACH;AAED,SAAS,EACP,GACwC;AACxC,KAAI,EAAa,WAAW,EAC1B;CAEF,IAAM,IAAO,EAAa,IACtB,IAAiC,EAAwB;AAM7D,QALI,EAAK,OAAO,eACd,IAAQ,EAAwB,cACvB,EAAK,OAAO,gBACrB,IAAQ,EAAwB,aAE3B,CACL;EACE;EACA,WAAW,EAAK,OAAO,EAAU,OAAO,EAAU;EACnD,CACF;;AAOH,SAAgB,EAAqB,EACnC,eACA,0BAC4B;CAC5B,IAAM,CAAC,GAAgB,KAAqB,EAAuB,CACjE;EACE,MAAM;EACN,IAAI;EACL,CACF,CAAC,EAWI,EAAE,SAAM,gBAAa,kBAAe,cAAW,0BACnD,EAViD,SAC1C;EACL;EACA;EACA,MAAM,EAAoC,EAAe;EAC1D,GACD;EAAC;EAAY;EAAqB;EAAe,CAIhB,CAAc,EAM3C,IAAQ,EAA0C;EACtD,MANsB,QAChB,GAAM,MAAM,SAAQ,MAAQ,EAAK,QAAQ,IAAI,EAAE,EACrD,CAAC,GAAM,MAAM,CAIP;EACG;EACT,iBAAiB,GAAiB;EAClC,eAAe;EACf,iBAAiB;EACjB,OAAO,EACL,SAAS,GACV;EACD,kBAAkB;EACnB,CAAC,EAEI,IAAU,CAAC,KAAa,EAAM,aAAa,CAAC,KAAK,WAAW;AAElE,QACE,kBAAC,OAAD;EAAK,WAAU;YACb,kBAAC,GAAD;GACE,OAAO,kBAAC,GAAD,EAA4B,UAAS,CAAA;GACjC;GACF;GACI;GACb,8BAA8B;AACvB,OAAe;;GAEF;GACpB,CAAA;EACE,CAAA"}

package/dist/components/dataaccess/AccessRequestSubmissionTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccessRequestSubmissionTable.js","names":[],"sources":["../../../src/components/dataaccess/AccessRequestSubmissionTable.tsx"],"sourcesContent":["import InfiniteTableLayout from '@/components/layout/InfiniteTableLayout'\nimport { useSearchAccessSubmissionsInfinite } from '@/synapse-queries/dataaccess/useDataAccessSubmission'\nimport { formatDate } from '@/utils/functions/DateFormatter'\nimport { ACT_TEAM_ID } from '@/utils/SynapseConstants'\nimport { Stack } from '@mui/material'\nimport {\n  SubmissionReviewerFilterType,\n  SubmissionSearchRequest,\n  SubmissionSearchResult,\n  SubmissionSearchSort,\n  SubmissionState,\n} from '@sage-bionetworks/synapse-types'\nimport {\n  createColumnHelper,\n  getCoreRowModel,\n  SortingState,\n  useReactTable,\n} from '@tanstack/react-table'\nimport dayjs from 'dayjs'\nimport { upperFirst } from 'lodash-es'\nimport { useMemo, useState } from 'react'\nimport { Link } from 'react-router'\nimport ColumnHeader from '../TanStackTable/ColumnHeader'\nimport StyledTanStackTable from '../TanStackTable/StyledTanStackTable'\nimport { UserBadge } from '../UserCard/UserBadge'\nimport UserOrTeamBadge from '../UserOrTeamBadge/UserOrTeamBadge'\nimport { getSortApiRequestFromTableSortState } from './UserAccessRequestHistory/SubmissionSortStateTranslator'\n\nconst columnHelper = createColumnHelper<SubmissionSearchResult>()\nconst columns = [\n  columnHelper.accessor('id', {\n    header: props => <ColumnHeader {...props} title={'Request'} />,\n    enableSorting: false,\n    cell: ctx => (\n      <Link to={`/Submissions/${ctx.getValue()}`}>{ctx.getValue()}</Link>\n    ),\n  }),\n  columnHelper.accessor('accessRequirementName', {\n    header: props => (\n      <ColumnHeader {...props} title={'Access Requirement Name'} />\n    ),\n    enableSorting: false,\n  }),\n  columnHelper.accessor('submitterId', {\n    header: props => <ColumnHeader {...props} title={'Submitter'} />,\n    enableSorting: false,\n    cell: ctx => <UserOrTeamBadge principalId={ctx.getValue()} />,\n  }),\n  columnHelper.accessor('state', {\n    header: props => <ColumnHeader {...props} title={'Status'} />,\n    enableSorting: false,\n    cell: ctx => upperFirst(ctx.getValue().toLocaleLowerCase()),\n  }),\n\n  columnHelper.accessor('accessorChanges', {\n    header: props => <ColumnHeader {...props} title={'Requesters'} />,\n    enableSorting: false,\n    cell: ctx => (\n      <Stack\n        sx={{\n          gap: 1,\n        }}\n      >\n        <UserOrTeamBadge principalId={ctx.row.original.submitterId} />\n        {ctx\n          .getValue()\n          .filter(user => ctx.row.original.submitterId !== user.userId)\n          .map(requester => (\n            <UserBadge\n              key={requester.userId}\n              userId={requester.userId}\n              className=\"requester\"\n            />\n          ))}\n      </Stack>\n    ),\n  }),\n  columnHelper.accessor('accessRequirementReviewerIds', {\n    header: props => <ColumnHeader {...props} title={'Reviewer(s)'} />,\n    enableSorting: false,\n    cell: ctx => (\n      <Stack\n        sx={{\n          gap: 1,\n        }}\n      >\n        {ctx.getValue().length === 0 ? (\n          <UserOrTeamBadge principalId={ACT_TEAM_ID} />\n        ) : (\n          ctx\n            .getValue()\n            .map(reviewerId => (\n              <UserOrTeamBadge key={reviewerId} principalId={reviewerId} />\n            ))\n        )}\n      </Stack>\n    ),\n  }),\n  columnHelper.accessor('createdOn', {\n    header: props => <ColumnHeader {...props} title={'Created Date'} />,\n    enableSorting: true,\n    cell: ctx => formatDate(dayjs(ctx.getValue())),\n    sortDescFirst: true,\n  }),\n]\n\nexport type AccessRequestSubmissionTableProps = {\n  showSubmitter?: boolean\n  showStatus?: boolean\n  showRequesters?: boolean\n  accessorId?: string\n  accessRequirementId?: string\n  reviewerId?: string\n  submissionState?: SubmissionState\n  reviewerFilterType?: SubmissionReviewerFilterType\n}\n\nexport function AccessRequestSubmissionTable({\n  showSubmitter = false,\n  showStatus = false,\n  showRequesters = false,\n  accessorId,\n  accessRequirementId,\n  reviewerId,\n  submissionState,\n  reviewerFilterType,\n}: AccessRequestSubmissionTableProps) {\n  const [tableSortState, setTableSortState] = useState<SortingState>([\n    {\n      desc: true,\n      id: 'createdOn',\n    },\n  ])\n\n  const searchRequest: SubmissionSearchRequest = useMemo(\n    () => ({\n      accessorId,\n      accessRequirementId,\n      submissionState,\n      reviewerId,\n      reviewerFilterType,\n      sort: getSortApiRequestFromTableSortState(tableSortState) as\n        | SubmissionSearchSort[] // cast to synapse-types (not OpenAPI-defined) type\n        | undefined,\n    }),\n    [\n      accessorId,\n      accessRequirementId,\n      submissionState,\n      reviewerId,\n      reviewerFilterType,\n      tableSortState,\n    ],\n  )\n\n  const { data, hasNextPage, fetchNextPage, isLoading, isFetchingNextPage } =\n    useSearchAccessSubmissionsInfinite(searchRequest)\n\n  const accessSubmissions = useMemo(\n    () => data?.pages.flatMap(page => page.results) ?? [],\n    [data?.pages],\n  )\n\n  const table = useReactTable<SubmissionSearchResult>({\n    data: accessSubmissions,\n    columns: columns,\n    getCoreRowModel: getCoreRowModel(),\n    enableFilters: false, // filters are handled by separate controls\n    manualSorting: true,\n    onSortingChange: setTableSortState,\n    state: {\n      sorting: tableSortState,\n      columnVisibility: {\n        submitterId: showSubmitter,\n        state: showStatus,\n        accessorChanges: showRequesters,\n      },\n    },\n    columnResizeMode: 'onChange',\n  })\n\n  const isEmpty = !isLoading && table.getRowModel().rows.length === 0\n\n  return (\n    <div className={'AccessSubmissionTable'}>\n      <InfiniteTableLayout\n        table={<StyledTanStackTable table={table} fullWidth={true} />}\n        isLoading={isLoading}\n        isEmpty={isEmpty}\n        hasNextPage={hasNextPage}\n        onFetchNextPageClicked={() => {\n          void fetchNextPage()\n        }}\n        isFetchingNextPage={isFetchingNextPage}\n      />\n    </div>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"AccessRequestSubmissionTable.js","names":[],"sources":["../../../src/components/dataaccess/AccessRequestSubmissionTable.tsx"],"sourcesContent":["import InfiniteTableLayout from '@/components/layout/InfiniteTableLayout'\nimport { useSearchAccessSubmissionsInfinite } from '@/synapse-queries/dataaccess/useDataAccessSubmission'\nimport { formatDate } from '@/utils/functions/DateFormatter'\nimport { ACT_TEAM_ID } from '@/utils/SynapseConstants'\nimport { Stack } from '@mui/material'\nimport {\n  SubmissionReviewerFilterType,\n  SubmissionSearchRequest,\n  SubmissionSearchResult,\n  SubmissionSearchSort,\n  SubmissionState,\n} from '@sage-bionetworks/synapse-types'\nimport {\n  createColumnHelper,\n  getCoreRowModel,\n  SortingState,\n  useReactTable,\n} from '@tanstack/react-table'\nimport dayjs from 'dayjs'\nimport { upperFirst } from 'lodash-es'\nimport { useMemo, useState } from 'react'\nimport { Link } from 'react-router'\nimport ColumnHeader from '../TanStackTable/ColumnHeader'\nimport StyledTanStackTable from '../TanStackTable/StyledTanStackTable'\nimport { UserBadge } from '../UserCard/UserBadge'\nimport UserOrTeamBadge from '../UserOrTeamBadge/UserOrTeamBadge'\nimport { getSortApiRequestFromTableSortState } from './UserAccessRequestHistory/SubmissionSortStateTranslator'\n\nconst columnHelper = createColumnHelper<SubmissionSearchResult>()\nconst columns = [\n  columnHelper.accessor('id', {\n    header: props => <ColumnHeader {...props} title={'Request'} />,\n    enableSorting: false,\n    cell: ctx => (\n      <Link to={`/Submissions/${ctx.getValue()}`}>{ctx.getValue()}</Link>\n    ),\n  }),\n  columnHelper.accessor('accessRequirementName', {\n    header: props => (\n      <ColumnHeader {...props} title={'Access Requirement Name'} />\n    ),\n    enableSorting: false,\n  }),\n  columnHelper.accessor('submitterId', {\n    header: props => <ColumnHeader {...props} title={'Submitter'} />,\n    enableSorting: false,\n    cell: ctx => <UserOrTeamBadge principalId={ctx.getValue()} />,\n  }),\n  columnHelper.accessor('state', {\n    header: props => <ColumnHeader {...props} title={'Status'} />,\n    enableSorting: false,\n    cell: ctx => upperFirst(ctx.getValue().toLocaleLowerCase()),\n  }),\n\n  columnHelper.accessor('accessorChanges', {\n    header: props => <ColumnHeader {...props} title={'Requesters'} />,\n    enableSorting: false,\n    cell: ctx => (\n      <Stack\n        sx={{\n          gap: 1,\n        }}\n      >\n        <UserOrTeamBadge principalId={ctx.row.original.submitterId} />\n        {ctx\n          .getValue()\n          .filter(user => ctx.row.original.submitterId !== user.userId)\n          .map(requester => (\n            <UserBadge\n              key={requester.userId}\n              userId={requester.userId}\n              className=\"requester\"\n            />\n          ))}\n      </Stack>\n    ),\n  }),\n  columnHelper.accessor('accessRequirementReviewerIds', {\n    header: props => <ColumnHeader {...props} title={'Reviewer(s)'} />,\n    enableSorting: false,\n    cell: ctx => (\n      <Stack\n        sx={{\n          gap: 1,\n        }}\n      >\n        {ctx.getValue().length === 0 ? (\n          <UserOrTeamBadge principalId={ACT_TEAM_ID} />\n        ) : (\n          ctx\n            .getValue()\n            .map(reviewerId => (\n              <UserOrTeamBadge key={reviewerId} principalId={reviewerId} />\n            ))\n        )}\n      </Stack>\n    ),\n  }),\n  columnHelper.accessor('createdOn', {\n    header: props => <ColumnHeader {...props} title={'Created Date'} />,\n    enableSorting: true,\n    cell: ctx => formatDate(dayjs(ctx.getValue())),\n    sortDescFirst: true,\n  }),\n]\n\nexport type AccessRequestSubmissionTableProps = {\n  showSubmitter?: boolean\n  showStatus?: boolean\n  showRequesters?: boolean\n  accessorId?: string\n  accessRequirementId?: string\n  reviewerId?: string\n  submissionState?: SubmissionState\n  reviewerFilterType?: SubmissionReviewerFilterType\n}\n\nexport function AccessRequestSubmissionTable({\n  showSubmitter = false,\n  showStatus = false,\n  showRequesters = false,\n  accessorId,\n  accessRequirementId,\n  reviewerId,\n  submissionState,\n  reviewerFilterType,\n}: AccessRequestSubmissionTableProps) {\n  const [tableSortState, setTableSortState] = useState<SortingState>([\n    {\n      desc: true,\n      id: 'createdOn',\n    },\n  ])\n\n  const searchRequest: SubmissionSearchRequest = useMemo(\n    () => ({\n      accessorId,\n      accessRequirementId,\n      submissionState,\n      reviewerId,\n      reviewerFilterType,\n      sort: getSortApiRequestFromTableSortState(tableSortState) as\n        | SubmissionSearchSort[] // cast to synapse-types (not OpenAPI-defined) type\n        | undefined,\n    }),\n    [\n      accessorId,\n      accessRequirementId,\n      submissionState,\n      reviewerId,\n      reviewerFilterType,\n      tableSortState,\n    ],\n  )\n\n  const { data, hasNextPage, fetchNextPage, isLoading, isFetchingNextPage } =\n    useSearchAccessSubmissionsInfinite(searchRequest)\n\n  const accessSubmissions = useMemo(\n    () => data?.pages.flatMap(page => page.results) ?? [],\n    [data?.pages],\n  )\n\n  const table = useReactTable<SubmissionSearchResult>({\n    data: accessSubmissions,\n    columns: columns,\n    getCoreRowModel: getCoreRowModel(),\n    enableFilters: false, // filters are handled by separate controls\n    manualSorting: true,\n    onSortingChange: setTableSortState,\n    state: {\n      sorting: tableSortState,\n      columnVisibility: {\n        submitterId: showSubmitter,\n        state: showStatus,\n        accessorChanges: showRequesters,\n      },\n    },\n    columnResizeMode: 'onChange',\n  })\n\n  const isEmpty = !isLoading && table.getRowModel().rows.length === 0\n\n  return (\n    <div className={'AccessSubmissionTable'}>\n      <InfiniteTableLayout\n        table={<StyledTanStackTable table={table} fullWidth={true} />}\n        isLoading={isLoading}\n        isEmpty={isEmpty}\n        hasNextPage={hasNextPage}\n        onFetchNextPageClicked={() => {\n          void fetchNextPage()\n        }}\n        isFetchingNextPage={isFetchingNextPage}\n      />\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/components/dataaccess/SubmissionPage/SubmissionPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SubmissionPage.d.ts","sourceRoot":"","sources":["../../../../src/components/dataaccess/SubmissionPage/SubmissionPage.tsx"],"names":[],"mappings":"AAoCA,MAAM,MAAM,mBAAmB,GAAG;IAChC,uCAAuC;IACvC,YAAY,EAAE,MAAM,GAAG,MAAM,CAAA;IAC7B,qDAAqD;IACrD,UAAU,EAAE,OAAO,CAAA;CACpB,CAAA;AAkED;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,KAAK,EAAE,mBAAmB,2CA8bhE"}
+{"version":3,"file":"SubmissionPage.d.ts","sourceRoot":"","sources":["../../../../src/components/dataaccess/SubmissionPage/SubmissionPage.tsx"],"names":[],"mappings":"AAsCA,MAAM,MAAM,mBAAmB,GAAG;IAChC,uCAAuC;IACvC,YAAY,EAAE,MAAM,GAAG,MAAM,CAAA;IAC7B,qDAAqD;IACrD,UAAU,EAAE,OAAO,CAAA;CACpB,CAAA;AAqED;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,KAAK,EAAE,mBAAmB,2CAuchE"}