fix(signinup): several issues (#12698)

- Fixed an issue where you have invitations in your available workspaces
for signup.
- Corrected the URL display in the browser when hovering over the twenty
logo on the sign-in/up form.
- The workspace list is now displayed when you are logged into the
default domain.
This commit is contained in:
Antoine Moreaux
2025-06-18 13:13:44 +02:00
committed by GitHub
parent c9344cf427
commit 9612a4928d
5 changed files with 47 additions and 28 deletions

View File

@ -5,7 +5,7 @@ import { Avatar } from 'twenty-ui/display';
import { UndecoratedLink } from 'twenty-ui/navigation'; import { UndecoratedLink } from 'twenty-ui/navigation';
import { REACT_APP_SERVER_BASE_URL } from '~/config'; import { REACT_APP_SERVER_BASE_URL } from '~/config';
import { useRedirectToDefaultDomain } from '~/modules/domain-manager/hooks/useRedirectToDefaultDomain'; import { useRedirectToDefaultDomain } from '~/modules/domain-manager/hooks/useRedirectToDefaultDomain';
import { AppPath } from '~/modules/types/AppPath'; import { useReadDefaultDomainFromConfiguration } from '@/domain-manager/hooks/useReadDefaultDomainFromConfiguration';
type LogoProps = { type LogoProps = {
primaryLogo?: string | null; primaryLogo?: string | null;
@ -59,6 +59,8 @@ export const Logo = ({
const { redirectToDefaultDomain } = useRedirectToDefaultDomain(); const { redirectToDefaultDomain } = useRedirectToDefaultDomain();
const defaultPrimaryLogoUrl = `${window.location.origin}/images/icons/android/android-launchericon-192-192.png`; const defaultPrimaryLogoUrl = `${window.location.origin}/images/icons/android/android-launchericon-192-192.png`;
const { defaultUrl } = useReadDefaultDomainFromConfiguration();
const primaryLogoUrl = getImageAbsoluteURI({ const primaryLogoUrl = getImageAbsoluteURI({
imageUrl: primaryLogo ?? defaultPrimaryLogoUrl, imageUrl: primaryLogo ?? defaultPrimaryLogoUrl,
baseUrl: REACT_APP_SERVER_BASE_URL, baseUrl: REACT_APP_SERVER_BASE_URL,
@ -77,7 +79,7 @@ export const Logo = ({
<StyledContainer onClick={() => onClick?.()}> <StyledContainer onClick={() => onClick?.()}>
{isUsingDefaultLogo ? ( {isUsingDefaultLogo ? (
<UndecoratedLink <UndecoratedLink
to={AppPath.SignInUp} to={defaultUrl.toString()}
onClick={redirectToDefaultDomain} onClick={redirectToDefaultDomain}
> >
<StyledPrimaryLogo src={primaryLogoUrl} /> <StyledPrimaryLogo src={primaryLogoUrl} />

View File

@ -3,15 +3,18 @@ import {
signInUpStepState, signInUpStepState,
} from '@/auth/states/signInUpStepState'; } from '@/auth/states/signInUpStepState';
import { useEffect } from 'react'; import { useEffect } from 'react';
import { useSetRecoilState } from 'recoil'; import { useRecoilValue, useSetRecoilState } from 'recoil';
import { isDefined } from 'twenty-shared/utils'; import { isDefined } from 'twenty-shared/utils';
import { useAuth } from '@/auth/hooks/useAuth'; import { useAuth } from '@/auth/hooks/useAuth';
import { useSearchParams } from 'react-router-dom'; import { useSearchParams } from 'react-router-dom';
import { availableWorkspacesState } from '@/auth/states/availableWorkspacesState';
import { countAvailableWorkspaces } from '@/auth/utils/availableWorkspacesUtils';
export const SignInUpGlobalScopeFormEffect = () => { export const SignInUpGlobalScopeFormEffect = () => {
const setSignInUpStep = useSetRecoilState(signInUpStepState); const setSignInUpStep = useSetRecoilState(signInUpStepState);
const [searchParams, setSearchParams] = useSearchParams(); const [searchParams, setSearchParams] = useSearchParams();
const { setAuthTokens, loadCurrentUser } = useAuth(); const { setAuthTokens, loadCurrentUser } = useAuth();
const availableWorkspaces = useRecoilValue(availableWorkspacesState);
useEffect(() => { useEffect(() => {
const tokenPair = searchParams.get('tokenPair'); const tokenPair = searchParams.get('tokenPair');
@ -20,6 +23,9 @@ export const SignInUpGlobalScopeFormEffect = () => {
searchParams.delete('tokenPair'); searchParams.delete('tokenPair');
setSearchParams(searchParams); setSearchParams(searchParams);
loadCurrentUser(); loadCurrentUser();
}
if (countAvailableWorkspaces(availableWorkspaces) > 1) {
setSignInUpStep(SignInUpStep.WorkspaceSelection); setSignInUpStep(SignInUpStep.WorkspaceSelection);
} }
}, [ }, [
@ -28,6 +34,7 @@ export const SignInUpGlobalScopeFormEffect = () => {
setSignInUpStep, setSignInUpStep,
loadCurrentUser, loadCurrentUser,
setAuthTokens, setAuthTokens,
availableWorkspaces,
]); ]);
return <></>; return <></>;

View File

@ -10,7 +10,11 @@ export const useReadDefaultDomainFromConfiguration = () => {
? `${domainConfiguration.defaultSubdomain}.${domainConfiguration.frontDomain}` ? `${domainConfiguration.defaultSubdomain}.${domainConfiguration.frontDomain}`
: domainConfiguration.frontDomain; : domainConfiguration.frontDomain;
const defaultUrl = new URL(window.location.href);
defaultUrl.hostname = defaultDomain;
return { return {
defaultDomain, defaultDomain,
defaultUrl,
}; };
}; };

View File

@ -1,11 +1,8 @@
import { useSignInUp } from '@/auth/sign-in-up/hooks/useSignInUp'; import { useSignInUp } from '@/auth/sign-in-up/hooks/useSignInUp';
import { useSignInUpForm } from '@/auth/sign-in-up/hooks/useSignInUpForm'; import { useSignInUpForm } from '@/auth/sign-in-up/hooks/useSignInUpForm';
import { import { SignInUpStep } from '@/auth/states/signInUpStepState';
SignInUpStep,
signInUpStepState,
} from '@/auth/states/signInUpStepState';
import { workspacePublicDataState } from '@/auth/states/workspacePublicDataState'; import { workspacePublicDataState } from '@/auth/states/workspacePublicDataState';
import { useRecoilValue, useSetRecoilState } from 'recoil'; import { useRecoilValue } from 'recoil';
import { Logo } from '@/auth/components/Logo'; import { Logo } from '@/auth/components/Logo';
import { Title } from '@/auth/components/Title'; import { Title } from '@/auth/components/Title';
@ -30,6 +27,7 @@ import { isDefined } from 'twenty-shared/utils';
import { AnimatedEaseIn } from 'twenty-ui/utilities'; import { AnimatedEaseIn } from 'twenty-ui/utilities';
import { PublicWorkspaceDataOutput } from '~/generated/graphql'; import { PublicWorkspaceDataOutput } from '~/generated/graphql';
import { SignInUpGlobalScopeFormEffect } from '@/auth/sign-in-up/components/internal/SignInUpGlobalScopeFormEffect'; import { SignInUpGlobalScopeFormEffect } from '@/auth/sign-in-up/components/internal/SignInUpGlobalScopeFormEffect';
import { useAuth } from '@/auth/hooks/useAuth';
const StandardContent = ({ const StandardContent = ({
workspacePublicData, workspacePublicData,
@ -62,7 +60,6 @@ const StandardContent = ({
export const SignInUp = () => { export const SignInUp = () => {
const { t } = useLingui(); const { t } = useLingui();
const setSignInUpStep = useSetRecoilState(signInUpStepState);
const { form } = useSignInUpForm(); const { form } = useSignInUpForm();
const { signInUpStep } = useSignInUp(form); const { signInUpStep } = useSignInUp(form);
@ -73,11 +70,14 @@ export const SignInUp = () => {
const isMultiWorkspaceEnabled = useRecoilValue(isMultiWorkspaceEnabledState); const isMultiWorkspaceEnabled = useRecoilValue(isMultiWorkspaceEnabledState);
const { workspaceInviteHash, workspace: workspaceFromInviteHash } = const { workspaceInviteHash, workspace: workspaceFromInviteHash } =
useWorkspaceFromInviteHash(); useWorkspaceFromInviteHash();
const { signOut } = useAuth();
const [searchParams] = useSearchParams(); const [searchParams] = useSearchParams();
const onClickOnLogo = () => { const onClickOnLogo = () => {
setSignInUpStep(SignInUpStep.Init); if (!isOnAWorkspace && signInUpStep === SignInUpStep.WorkspaceSelection) {
signOut();
}
}; };
const title = useMemo(() => { const title = useMemo(() => {

View File

@ -406,7 +406,8 @@ export class UserWorkspaceService extends TypeOrmQueryService<UserWorkspace> {
displayName: workspace.displayName, displayName: workspace.displayName,
workspaceUrls: this.domainManagerService.getWorkspaceUrls(workspace), workspaceUrls: this.domainManagerService.getWorkspaceUrls(workspace),
logo: workspace.logo, logo: workspace.logo,
sso: workspace.workspaceSSOIdentityProviders.reduce( sso:
workspace.workspaceSSOIdentityProviders?.reduce(
(acc, identityProvider) => (acc, identityProvider) =>
acc.concat( acc.concat(
identityProvider.status === 'Inactive' identityProvider.status === 'Inactive'
@ -422,7 +423,7 @@ export class UserWorkspaceService extends TypeOrmQueryService<UserWorkspace> {
], ],
), ),
[] as AvailableWorkspace['sso'], [] as AvailableWorkspace['sso'],
), ) ?? [],
}; };
} }
@ -446,7 +447,12 @@ export class UserWorkspaceService extends TypeOrmQueryService<UserWorkspace> {
({ workspace, appToken }) => { ({ workspace, appToken }) => {
return { return {
...this.castWorkspaceToAvailableWorkspace(workspace), ...this.castWorkspaceToAvailableWorkspace(workspace),
...(appToken ? { personalInviteToken: appToken.value } : {}), ...(appToken
? {
personalInviteToken: appToken.value,
inviteHash: workspace.inviteHash,
}
: {}),
}; };
}, },
), ),