{"version":3,"file":"OrgSettingsDetailsSection.mjs","sources":["../../../../../../../../web/src/adminPortal/settings/OrgSettingsDetailsSection.tsx"],"sourcesContent":["import { Organization } from '@stytch/core/public';\nimport React, { useCallback, useMemo } from 'react';\n\nimport { FlexBox } from '../components/FlexBox';\nimport { Input } from '../components/Input';\nimport { SettingsContainer, useSettingsContainer } from '../components/SettingsContainer';\nimport { SettingsList } from '../components/SettingsList';\nimport { SettingsListItem } from '../components/SettingsListItem';\nimport { Typography } from '../components/Typography';\nimport { FormSectionBody } from '../utils/FormSectionBody';\nimport { isEmptyObject } from '../utils/isEmptyObject';\nimport { useFormState } from '../utils/useFormState';\nimport { useMutateOrganization } from '../utils/useMutateOrganization';\nimport { useRbac } from '../utils/useRbac';\nimport { useStateSliceSetter } from '../utils/useStateSliceSetter';\nimport { useOrgSettingsRouterController } from './AdminPortalOrgRouter';\n\ninterface OrgDetailsFormState {\n  organizationName: string;\n  organizationSlug: string;\n}\ninterface OrgSettingsDetailsBodyProps extends FormSectionBody<OrgDetailsFormState> {\n  canSetName: boolean | undefined;\n  canSetSlug: boolean | undefined;\n}\n\nexport const useMutateOrgSettingsDetails = () => {\n  const { mutate } = useMutateOrganization();\n\n  const setOrgDetails = ({\n    organizationName,\n    organizationSlug,\n  }: {\n    organizationName?: string;\n    organizationSlug?: string;\n  }) => {\n    return mutate(\n      {\n        ...(organizationName && { organization_name: organizationName }),\n        ...(organizationSlug && { organization_slug: organizationSlug }),\n      },\n      {\n        errorMessage: 'Failed to update details.',\n      },\n    );\n  };\n\n  return { setOrgDetails };\n};\n\nexport const OrgSettingsDetailsBody = ({\n  canSetName,\n  canSetSlug,\n  remoteState,\n  localState,\n  setLocalState,\n}: OrgSettingsDetailsBodyProps) => {\n  const handleNameChange = useStateSliceSetter(setLocalState, 'organizationName');\n  const handleSlugChange = useStateSliceSetter(setLocalState, 'organizationSlug');\n\n  const { editing } = useSettingsContainer();\n\n  return (\n    <FlexBox flexDirection=\"column\" gap={2}>\n      <SettingsList>\n        <SettingsListItem title=\"Name\">\n          {editing && canSetName ? (\n            <Input placeholder=\"Enter Name\" value={localState.organizationName} onChange={handleNameChange} />\n          ) : (\n            <Typography variant=\"body2\">{remoteState.organizationName}</Typography>\n          )}\n        </SettingsListItem>\n        <SettingsListItem title=\"Slug\">\n          {editing && canSetSlug ? (\n            <Input placeholder=\"Enter Slug\" value={localState.organizationSlug} onChange={handleSlugChange} />\n          ) : (\n            <Typography variant=\"body2\">{remoteState.organizationSlug}</Typography>\n          )}\n        </SettingsListItem>\n      </SettingsList>\n    </FlexBox>\n  );\n};\n\nexport const OrgSettingsDetailsSection = ({ orgInfo }: { orgInfo: Organization }) => {\n  const { data: canSetName } = useRbac('stytch.organization', 'update.info.name');\n  const { data: canSetSlug } = useRbac('stytch.organization', 'update.info.slug');\n  const remoteState = useMemo<OrgDetailsFormState>(\n    () => ({\n      organizationName: orgInfo.organization_name,\n      organizationSlug: orgInfo.organization_slug,\n    }),\n    [orgInfo],\n  );\n  const { localState, setLocalState, editing, handleSetEditing } = useFormState({ remoteState });\n\n  const { useBlockNavigation } = useOrgSettingsRouterController();\n  const { setOrgDetails } = useMutateOrgSettingsDetails();\n\n  const findMutatedProperties = useCallback(() => {\n    const mutatedProperties: Partial<OrgDetailsFormState> = {};\n\n    if (remoteState.organizationName !== localState.organizationName && localState.organizationName.length > 0) {\n      mutatedProperties.organizationName = localState.organizationName;\n    }\n    if (remoteState.organizationSlug !== localState.organizationSlug && localState.organizationSlug.length > 0) {\n      mutatedProperties.organizationSlug = localState.organizationSlug;\n    }\n    return mutatedProperties;\n  }, [\n    localState.organizationName,\n    localState.organizationSlug,\n    remoteState.organizationName,\n    remoteState.organizationSlug,\n  ]);\n  const handleSave = useCallback(async () => {\n    const mutatedProperties = findMutatedProperties();\n\n    if (!isEmptyObject(mutatedProperties)) {\n      await setOrgDetails({\n        organizationName: mutatedProperties.organizationName,\n        organizationSlug: mutatedProperties.organizationSlug,\n      });\n    }\n\n    return;\n  }, [setOrgDetails, findMutatedProperties]);\n\n  const disableSave = isEmptyObject(findMutatedProperties());\n\n  return (\n    <SettingsContainer\n      title=\"Details\"\n      hasCTA={canSetName || canSetSlug}\n      onSave={handleSave}\n      useBlockNavigation={useBlockNavigation}\n      editing={editing}\n      setEditing={handleSetEditing}\n      disableSave={disableSave}\n    >\n      <OrgSettingsDetailsBody\n        canSetName={canSetName}\n        canSetSlug={canSetSlug}\n        localState={localState}\n        remoteState={remoteState}\n        setLocalState={setLocalState}\n      />\n    </SettingsContainer>\n  );\n};\n"],"names":["useMutateOrgSettingsDetails","mutate","useMutateOrganization","setOrgDetails","organizationName","organizationSlug","organization_name","organization_slug","errorMessage","OrgSettingsDetailsBody","canSetName","canSetSlug","remoteState","localState","setLocalState","handleNameChange","useStateSliceSetter","handleSlugChange","editing","useSettingsContainer","React","FlexBox","flexDirection","gap","SettingsList","SettingsListItem","title","Input","placeholder","value","onChange","Typography","variant","OrgSettingsDetailsSection","orgInfo","data","useRbac","useMemo","handleSetEditing","useFormState","useBlockNavigation","useOrgSettingsRouterController","findMutatedProperties","useCallback","mutatedProperties","length","handleSave","isEmptyObject","disableSave","SettingsContainer","hasCTA","onSave","setEditing"],"mappings":"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"}