{"version":3,"sources":["../../../src/lib/user-profile.tsx"],"sourcesContent":["\"use client\";\nimport * as React from \"react\";\nimport {\n  Box,\n  Card,\n  Flex,\n  Inset,\n  Separator,\n  Strong,\n  Text,\n} from \"@radix-ui/themes\";\nimport { Avatar, Button, Skeleton } from \"./elements.js\";\nimport * as DataList from \"./data-list.js\";\nimport { Me, OAuthProfile, MeOauthProfiles } from \"../api/endpoint.js\";\nimport { ChangeEmailDialog } from \"./change-email-dialog.js\";\nimport { EditUserProfileDialog } from \"./edit-user-profile-dialog.js\";\nimport {\n  getBestName,\n  getDomProps,\n  type WidgetRootState,\n  type WidgetRootDomProps,\n} from \"./utils.js\";\nimport { OAuthIcon, getOAuthName, type OAuthAccount } from \"./oauth-icons.js\";\nimport { GenericError } from \"./generic-error.js\";\nimport { Translation } from \"./i18n/translation.js\";\n\ninterface UserProfileProps extends WidgetRootDomProps {\n  userData: Me;\n}\n\nconst UserProfile: React.FC<UserProfileProps> = ({\n  userData: user,\n  ...domProps\n}) => {\n  const oauthAccounts = user.oauthProfiles\n    ? (Object.entries(user.oauthProfiles) as [\n        keyof Exclude<MeOauthProfiles, null>,\n        OAuthProfile,\n      ][])\n    : [];\n  return (\n    <Card size=\"2\" {...getWidgetRootDomProps(\"resolved\", domProps)}>\n      <List>\n        {user.profilePictureUrl && (\n          <>\n            <ListItem>\n              <ListTitle minWidth=\"220px\">\n                <Translation\n                  defaultMessage=\"Profile picture\"\n                  description=\"Label for the user's avatar\"\n                  id=\"RvLqCQ\"\n                />\n              </ListTitle>\n              <ListValue>\n                <Avatar\n                  size=\"2\"\n                  fallback={<FallbackUserIcon />}\n                  src={user.profilePictureUrl}\n                />\n              </ListValue>\n            </ListItem>\n\n            <ListSeparator />\n          </>\n        )}\n\n        <ListItem>\n          <ListTitle>\n            <Translation\n              defaultMessage=\"Full name\"\n              id=\"kkBScm\"\n              description=\"Label for user's full name field\"\n            />\n          </ListTitle>\n          <ListValue>\n            <Flex\n              align=\"center\"\n              justify=\"between\"\n              width=\"100%\"\n              minHeight=\"var(--space-6)\"\n            >\n              <Text size=\"2\">\n                {getBestName(user) || (\n                  <Text\n                    color=\"gray\"\n                    style={{ color: \"var(--gray-10)\", cursor: \"default\" }}\n                  >\n                    <Translation\n                      defaultMessage=\"Not set\"\n                      id=\"i4vzAY\"\n                      description=\"Placeholder text when user's name is not set\"\n                    />\n                  </Text>\n                )}\n              </Text>\n\n              <EditUserProfileDialog user={user}>\n                <Button variant=\"secondary\">\n                  <Translation\n                    defaultMessage=\"Edit\"\n                    id=\"5bhXUz\"\n                    description=\"Button text to edit user profile\"\n                  />\n                </Button>\n              </EditUserProfileDialog>\n            </Flex>\n          </ListValue>\n        </ListItem>\n\n        <ListSeparator />\n\n        <ListItem>\n          <ListTitle>\n            <Translation\n              defaultMessage=\"Email address\"\n              id=\"nLk5pa\"\n              description=\"Label for user's email address field\"\n            />\n          </ListTitle>\n          <ListValue>\n            <Flex\n              align=\"center\"\n              justify=\"between\"\n              width=\"100%\"\n              minHeight=\"var(--space-6)\"\n            >\n              <Text size=\"2\">{user.email}</Text>\n\n              <ChangeEmailDialog user={user}>\n                <Button variant=\"secondary\">\n                  <Translation\n                    defaultMessage=\"Edit\"\n                    id=\"+2ILQR\"\n                    description=\"Button text to edit the user's email address\"\n                  />\n                </Button>\n              </ChangeEmailDialog>\n            </Flex>\n          </ListValue>\n        </ListItem>\n\n        {oauthAccounts.length > 0 && (\n          <>\n            <ListSeparator />\n\n            <ListItem>\n              <ListTitle>\n                <Translation\n                  defaultMessage=\"Connected accounts\"\n                  id=\"AW/A69\"\n                  description=\"Label for user's connected OAuth accounts\"\n                />\n              </ListTitle>\n              <ListValue>\n                <Flex direction=\"column\" gap=\"2\">\n                  {oauthAccounts.map(([account, data]) => (\n                    <OAuthAccount\n                      key={account}\n                      account={account}\n                      email={data?.email}\n                    />\n                  ))}\n                </Flex>\n              </ListValue>\n            </ListItem>\n          </>\n        )}\n      </List>\n    </Card>\n  );\n};\n\ninterface UserProfileLoadingProps extends WidgetRootDomProps {}\n\nconst UserProfileLoading: React.FC<UserProfileLoadingProps> = (props) => {\n  return (\n    <Card size=\"2\" {...getWidgetRootDomProps(\"loading\", props)}>\n      <List>\n        <ListItem>\n          <ListTitle minWidth=\"220px\">\n            <Skeleton>\n              <Translation\n                defaultMessage=\"Full name\"\n                id=\"nc7fru\"\n                description=\"Loading placeholder for full name label\"\n              />\n            </Skeleton>\n          </ListTitle>\n          <ListValue>\n            <Flex\n              align=\"center\"\n              justify=\"between\"\n              width=\"100%\"\n              minHeight=\"var(--space-6)\"\n            >\n              <Text size=\"2\">\n                <Skeleton>\n                  <Translation\n                    defaultMessage=\"Full name\"\n                    id=\"6GcWa2\"\n                    description=\"Loading placeholder for full name value\"\n                  />\n                </Skeleton>\n              </Text>\n            </Flex>\n          </ListValue>\n        </ListItem>\n\n        <ListSeparator />\n\n        <ListItem>\n          <ListTitle>\n            <Skeleton>\n              <Translation\n                defaultMessage=\"Email address\"\n                id=\"gjqw+H\"\n                description=\"Loading placeholder for email address label\"\n              />\n            </Skeleton>\n          </ListTitle>\n          <ListValue>\n            <Flex align=\"center\" minHeight=\"var(--space-6)\">\n              <Text size=\"2\">\n                <Skeleton>\n                  <Translation\n                    defaultMessage=\"Email address\"\n                    id=\"75F+g5\"\n                    description=\"Loading placeholder for email address value\"\n                  />\n                </Skeleton>\n              </Text>\n            </Flex>\n          </ListValue>\n        </ListItem>\n      </List>\n    </Card>\n  );\n};\n\ninterface UserProfileErrorProps extends WidgetRootDomProps {\n  error: unknown;\n}\n\nconst UserProfileError: React.FC<UserProfileErrorProps> = ({\n  error,\n  ...domProps\n}) => {\n  return (\n    <Card size=\"2\" {...getWidgetRootDomProps(\"error\", domProps)}>\n      <GenericError error={error} />\n    </Card>\n  );\n};\n\nconst ListIdContext = React.createContext<string | null>(null);\nListIdContext.displayName = \"ListIdContext\";\n\nconst List = ({ children }: { children: React.ReactNode }) => {\n  const listId = `user-profile-list-${React.useId()}`;\n  return (\n    <ListIdContext.Provider value={listId}>\n      <DataList.Root as=\"div\">{children}</DataList.Root>\n    </ListIdContext.Provider>\n  );\n};\n\nconst ListItemIdContext = React.createContext<string | null>(null);\nListItemIdContext.displayName = \"ListItemIdContext\";\n\nconst ListItem = ({ children }: { children: React.ReactNode }) => {\n  const listId = React.useContext(ListIdContext);\n  const currentId = React.useId();\n  const listItemId = [listId, \"item\", currentId].filter(Boolean).join(\"-\");\n  return (\n    <ListItemIdContext.Provider value={listItemId}>\n      <DataList.Item align=\"center\">{children}</DataList.Item>\n    </ListItemIdContext.Provider>\n  );\n};\n\nconst ListTitle = ({\n  children,\n  ...props\n}: Omit<DataList.LabelProps, \"as\" | \"role\" | \"asChild\">) => {\n  const listItemId = React.useContext(ListItemIdContext);\n  const titleId = [listItemId, \"title\"].filter(Boolean).join(\"-\");\n  return (\n    <DataList.Label as=\"div\" role=\"term\" highContrast id={titleId} {...props}>\n      <Strong>{children}</Strong>\n    </DataList.Label>\n  );\n};\n\nconst ListValue = ({ children }: { children: React.ReactNode }) => {\n  const listItemId = React.useContext(ListItemIdContext);\n  const titleId = [listItemId, \"title\"].filter(Boolean).join(\"-\");\n  return (\n    <DataList.Value as=\"div\" role=\"definition\" aria-labelledby={titleId}>\n      {children}\n    </DataList.Value>\n  );\n};\n\nconst ListSeparator = () => (\n  <Box asChild gridColumn=\"span 2\" aria-hidden>\n    <Inset side=\"x\">\n      <Separator size=\"4\" />\n    </Inset>\n  </Box>\n);\n\nconst OAuthAccount = ({\n  account,\n  email,\n}: {\n  account: OAuthAccount;\n  email?: string | null;\n}) => {\n  const name = getOAuthName(account);\n  return (\n    <Flex align=\"center\" gap=\"1\">\n      <OAuthIcon account={account} />\n      <Text size=\"2\" ml=\"1\">\n        {name}\n      </Text>\n      {email && (\n        <Box display={{ initial: \"none\", sm: \"contents\" }}>\n          {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}\n          <Text size=\"2\" color=\"gray\">\n            ∙\n          </Text>\n          <Text size=\"2\" color=\"gray\">\n            {email}\n          </Text>\n        </Box>\n      )}\n    </Flex>\n  );\n};\n\nconst FallbackUserIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"20\"\n    height=\"20\"\n    fill=\"currentColor\"\n    viewBox=\"0 0 256 256\"\n  >\n    {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}\n    <title>User icon</title>\n    <path d=\"M229.19,213c-15.81-27.32-40.63-46.49-69.47-54.62a70,70,0,1,0-63.44,0C67.44,166.5,42.62,185.67,26.81,213a6,6,0,1,0,10.38,6C56.4,185.81,90.34,166,128,166s71.6,19.81,90.81,53a6,6,0,1,0,10.38-6ZM70,96a58,58,0,1,1,58,58A58.07,58.07,0,0,1,70,96Z\" />\n  </svg>\n);\n\nfunction getWidgetRootDomProps(\n  state: WidgetRootState,\n  domProps: WidgetRootDomProps,\n) {\n  return getDomProps({\n    ...domProps,\n    isWidgetRoot: true,\n    widgetId: \"user-profile\",\n    widgetState: state,\n  });\n}\n\nexport type {\n  UserProfileProps,\n  UserProfileLoadingProps,\n  UserProfileErrorProps,\n};\nexport { UserProfile, UserProfileLoading, UserProfileError };\n"],"mappings":"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","names":[]}