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:
@ -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} />
|
||||||
|
|||||||
@ -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 <></>;
|
||||||
|
|||||||
@ -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,
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|||||||
@ -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(() => {
|
||||||
|
|||||||
@ -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,
|
||||||
|
}
|
||||||
|
: {}),
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
|
|||||||
Reference in New Issue
Block a user