diff --git a/internal-ui/package-lock.json b/internal-ui/package-lock.json index cbc2a1ccb..04d901172 100644 --- a/internal-ui/package-lock.json +++ b/internal-ui/package-lock.json @@ -29,6 +29,7 @@ "@rollup/rollup-linux-x64-gnu": "4.13.2" }, "peerDependencies": { + "@boxyhq/react-ui": ">=3.3.42", "@heroicons/react": ">=2.1.1", "classnames": ">=2.5.1", "formik": ">=2.4.5", diff --git a/internal-ui/package.json b/internal-ui/package.json index d9d6ecdd2..3efe628b8 100644 --- a/internal-ui/package.json +++ b/internal-ui/package.json @@ -43,6 +43,7 @@ "@rollup/rollup-linux-x64-gnu": "4.13.2" }, "peerDependencies": { + "@boxyhq/react-ui": ">=3.3.42", "@heroicons/react": ">=2.1.1", "classnames": ">=2.5.1", "formik": ">=2.4.5", diff --git a/internal-ui/src/federated-saml/Edit.tsx b/internal-ui/src/federated-saml/Edit.tsx index a7d5d6caf..447e67525 100644 --- a/internal-ui/src/federated-saml/Edit.tsx +++ b/internal-ui/src/federated-saml/Edit.tsx @@ -9,7 +9,7 @@ import EyeSlashIcon from '@heroicons/react/24/outline/EyeSlashIcon'; import { Card } from '../shared'; import { defaultHeaders } from '../utils'; -import { ItemList } from '../shared/ItemList'; +import { ItemList } from '@boxyhq/react-ui/shared'; import { CopyToClipboardButton } from '../shared/InputWithCopyButton'; import { IconButton } from '../shared/IconButton'; @@ -179,12 +179,14 @@ export const Edit = ({ )} {connectionIsOIDC && ( - - {t('bui-sl-allowed-redirect-urls-new')} - formik.setFieldValue('redirectUrl', newList)}> + fieldName='redirectUrl' + handleItemListUpdate={(fieldName, newList) => formik.setFieldValue(fieldName, newList)} + /> )} diff --git a/internal-ui/src/federated-saml/EditFederatedSAMLApp.tsx b/internal-ui/src/federated-saml/EditFederatedSAMLApp.tsx index 55af560af..af7dfaa57 100644 --- a/internal-ui/src/federated-saml/EditFederatedSAMLApp.tsx +++ b/internal-ui/src/federated-saml/EditFederatedSAMLApp.tsx @@ -5,7 +5,7 @@ import { Edit } from './Edit'; import { EditAttributesMapping } from './EditAttributesMapping'; import { DeleteCard, Loading, ConfirmationModal } from '../shared'; import { useTranslation } from 'next-i18next'; -import { useState } from 'react'; +import { useEffect, useState } from 'react'; import { defaultHeaders, fetcher } from '../utils'; import { PageHeader } from '../shared'; @@ -27,12 +27,17 @@ export const EditFederatedSAMLApp = ({ const { data, isLoading, error, mutate } = useSWR<{ data: SAMLFederationApp }>(urls.getApp, fetcher); + useEffect(() => { + if (error) { + onError?.(error); + } + }, [error, onError]); + if (isLoading) { return ; } if (error) { - onError?.(error); return; } diff --git a/internal-ui/src/federated-saml/NewFederatedSAMLApp.tsx b/internal-ui/src/federated-saml/NewFederatedSAMLApp.tsx index 154926588..a05f6f7e7 100644 --- a/internal-ui/src/federated-saml/NewFederatedSAMLApp.tsx +++ b/internal-ui/src/federated-saml/NewFederatedSAMLApp.tsx @@ -7,7 +7,7 @@ import QuestionMarkCircleIcon from '@heroicons/react/24/outline/QuestionMarkCirc import { defaultHeaders } from '../utils'; import { AttributesMapping } from './AttributesMapping'; import { PageHeader } from '../shared'; -import { ItemList } from '../shared/ItemList'; +import { ItemList } from '@boxyhq/react-ui/shared'; type NewSAMLFederationApp = Pick< SAMLFederationApp, @@ -177,12 +177,14 @@ export const NewFederatedSAMLApp = ({ )} {connectionIsOIDC && ( - - {t('bui-sl-allowed-redirect-urls-new')} - formik.setFieldValue('redirectUrl', newList)}> + fieldName='redirectUrl' + handleItemListUpdate={(fieldName, newList) => formik.setFieldValue(fieldName, newList)} + /> )} {connectionIsSAML && ( diff --git a/internal-ui/src/shared/ItemList.tsx b/internal-ui/src/shared/ItemList.tsx deleted file mode 100644 index 6f4dd349f..000000000 --- a/internal-ui/src/shared/ItemList.tsx +++ /dev/null @@ -1,73 +0,0 @@ -import { useTranslation } from 'next-i18next'; -import XMarkIcon from '@heroicons/react/24/outline/XMarkIcon'; - -export const ItemList = ({ - currentlist, - onItemListChange, -}: { - currentlist: string | string[]; - onItemListChange: (list: string[]) => void; -}) => { - const { t } = useTranslation('common'); - - const list = Array.isArray(currentlist) ? currentlist : [currentlist]; - - const addAnother = () => { - onItemListChange([...list, '']); - }; - - return ( - - - {list.map((item, index) => ( - - { - const newList = [...list]; - newList[index] = newItem; - onItemListChange(newList); - }} - onItemDelete={() => { - onItemListChange(list.filter((_, i) => i !== index)); - }} - /> - - ))} - - - {t('bui-fs-add')} - - - - - ); -}; - -const ItemRow = ({ - item, - onItemChange, - onItemDelete, -}: { - item: string; - onItemChange: (newItem: string) => void; - onItemDelete: () => void; -}) => { - return ( - - { - onItemChange(e.target.value); - }} - required - /> - - - - - ); -}; diff --git a/internal-ui/vite.config.ts b/internal-ui/vite.config.ts index fcdcc6ff7..9cb6bd6e2 100644 --- a/internal-ui/vite.config.ts +++ b/internal-ui/vite.config.ts @@ -24,6 +24,7 @@ export default defineConfig({ 'formik', 'react-daisyui', 'react-tagsinput', + '@boxyhq/react-ui', ], }, }, diff --git a/lib/env.ts b/lib/env.ts index b345c7ba6..80aa50aec 100644 --- a/lib/env.ts +++ b/lib/env.ts @@ -120,7 +120,7 @@ const jacksonOptions: JacksonOption = { const adminPortalSSODefaults = { tenant: process.env.ADMIN_PORTAL_SSO_TENANT || '_jackson_boxyhq', product: process.env.ADMIN_PORTAL_SSO_PRODUCT || '_jackson_admin_portal', - redirectUrl: externalUrl, + redirectUrl: [externalUrl], defaultRedirectUrl: `${externalUrl}/admin/auth/idp-login`, }; diff --git a/lib/utils.ts b/lib/utils.ts index 8a1e07e37..a1e4ab7db 100644 --- a/lib/utils.ts +++ b/lib/utils.ts @@ -104,6 +104,6 @@ export const parsePaginateApiParams = (params: NextApiRequest['query']): Paginat export type AdminPortalSSODefaults = { tenant: string; product: string; - redirectUrl: string; + redirectUrl: string[]; defaultRedirectUrl: string; }; diff --git a/locales/en/common.json b/locales/en/common.json index 06cac8308..ee286c708 100644 --- a/locales/en/common.json +++ b/locales/en/common.json @@ -185,7 +185,6 @@ "bui-fs-idp-attribute": "IdP Attribute", "bui-fs-add-mapping": "Add Mapping", "bui-fs-add-another": "Add another", - "bui-fs-add": "Add", "bui-fs-no-apps": "No Identity Federation Apps found.", "bui-fs-no-apps-desc": "Create a new App to configure Identity Federation.", "bui-fs-entity-id": "Entity ID / Audience URI / Audience Restriction", diff --git a/package-lock.json b/package-lock.json index 8d544f423..e24caa428 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,7 +12,7 @@ "dependencies": { "@boxyhq/internal-ui": "file:internal-ui", "@boxyhq/metrics": "0.2.6", - "@boxyhq/react-ui": "3.3.41", + "@boxyhq/react-ui": "3.3.42", "@boxyhq/saml-jackson": "file:npm", "@heroicons/react": "2.1.3", "@retracedhq/logs-viewer": "2.7.1", @@ -100,6 +100,7 @@ "@rollup/rollup-linux-x64-gnu": "4.13.2" }, "peerDependencies": { + "@boxyhq/react-ui": ">=3.3.42", "@heroicons/react": ">=2.1.1", "classnames": ">=2.5.1", "formik": ">=2.4.5", @@ -2052,9 +2053,9 @@ } }, "node_modules/@boxyhq/react-ui": { - "version": "3.3.41", - "resolved": "https://registry.npmjs.org/@boxyhq/react-ui/-/react-ui-3.3.41.tgz", - "integrity": "sha512-j0c4VVNoqx73i3gkQQx16KOhfK7PRdUO6wvgxGwhaRC7cqf+NoSSqZuyazYu1PyDCTeiQv6vv/07yIuAQuP+ZA==", + "version": "3.3.42", + "resolved": "https://registry.npmjs.org/@boxyhq/react-ui/-/react-ui-3.3.42.tgz", + "integrity": "sha512-JTzCeELT3tMFrWCRjg2HjIks4TTme7i5XbiS1jymtUODk3crMsH9TGpeeNGYeCoHGtIBDnRv7F3MW2wgdZ1FrQ==", "dependencies": { "react": "^16.8.0 || ^17.0.0 || ^18.0.0", "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0", diff --git a/package.json b/package.json index ece4d8ef5..d3b2bebcf 100644 --- a/package.json +++ b/package.json @@ -63,7 +63,7 @@ "dependencies": { "@boxyhq/internal-ui": "file:internal-ui", "@boxyhq/metrics": "0.2.6", - "@boxyhq/react-ui": "3.3.41", + "@boxyhq/react-ui": "3.3.42", "@boxyhq/saml-jackson": "file:npm", "@heroicons/react": "2.1.3", "@retracedhq/logs-viewer": "2.7.1", diff --git a/styles/sdk-override.module.css b/styles/sdk-override.module.css index e05e85ed4..bd9f3ac87 100644 --- a/styles/sdk-override.module.css +++ b/styles/sdk-override.module.css @@ -2,6 +2,6 @@ .sdk-input:focus, .sdk-select:focus-visible + span { /* Below styles copied from the tailwindcss/forms plugin */ - outline: 2px solid hsla(var(--bc) / 0.2); + outline: 2px solid oklch(var(--bc) / 0.2); outline-offset: 2px; }