IlyaSobolev/DocSpace-buildtools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web: fix confirm pages

Browse Source
This commit is contained in:
Timofey Boyko 2023-04-07 17:54:49 +03:00
parent bc27f6684e
commit 809929f18b
9 changed files with 167 additions and 135 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/client/src/Shell.jsx
View File

@ -466,7 +466,7 @@ const Shell = ({ items = [], page = "home", ...rest }) => {
}
/>
<Route path={"/confirm"} element={<ConfirmRoute />} />
<Route path={"/confirm/*"} element={<ConfirmRoute />} />
<Route
path={"/portal-settings"}

68
packages/client/src/helpers/confirmRoute.js
View File

@ -1,5 +1,5 @@
import React from "react";
import { Route } from "react-router-dom";
import { useLocation } from "react-router-dom";
import { ValidationResult } from "./../helpers/constants";
import Loader from "@docspace/components/loader";
import Section from "@docspace/common/components/Section";
@ -7,23 +7,21 @@ import { checkConfirmLink } from "@docspace/common/api/user"; //TODO: Move AuthS
import { combineUrl, getObjectByLocation } from "@docspace/common/utils";
import { inject, observer } from "mobx-react";
class ConfirmRoute extends React.Component {
constructor(props) {
super(props);
this.state = {
linkData: {},
isLoaded: false,
};
}
const ConfirmRoute = (props) => {
const [state, setState] = React.useState({
linkData: {},
isLoaded: false,
});
componentDidMount() {
const { forUnauthorized, isAuthenticated } = this.props;
const location = useLocation();
React.useEffect(() => {
const { forUnauthorized, isAuthenticated } = props;
if (forUnauthorized && isAuthenticated) {
this.props.logout();
props.logout();
}
const { location } = this.props;
const { search } = location;
const queryParams = getObjectByLocation(location);
@ -53,10 +51,7 @@ class ConfirmRoute extends React.Component {
linkData,
});
this.setState({
isLoaded: true,
linkData,
});
setState((val) => ({ ...val, isLoaded: true, linkData }));
break;
case ValidationResult.Invalid:
console.error("invlid link", { confirmLinkData, validationResult });
@ -98,33 +93,22 @@ class ConfirmRoute extends React.Component {
"/error"
);
});
}
}, []);
render() {
const { component: Component, ...rest } = this.props;
// console.log(`ConfirmRoute render`, this.props, this.state);
// console.log(`ConfirmRoute render`, this.props, this.state);
return (
<Route
{...rest}
render={(props) =>
!this.state.isLoaded ? (
<Section>
<Section.SectionBody>
<Loader className="pageLoader" type="rombs" size="40px" />
</Section.SectionBody>
</Section>
) : (
<Component
{...(props = { ...props, linkData: this.state.linkData })}
/>
)
}
/>
);
}
}
return !state.isLoaded ? (
<Section>
<Section.SectionBody>
<Loader className="pageLoader" type="rombs" size="40px" />
</Section.SectionBody>
</Section>
) : (
React.cloneElement(props.children, {
linkData: state.linkData,
})
);
};
export default inject(({ auth }) => {
const { isAuthenticated, logout } = auth;

8
packages/client/src/helpers/utils.js
View File

@ -100,10 +100,10 @@ export const onItemClick = (e) => {
export const getPasswordErrorMessage = (t, settings) => {
return `${t("Common:PasswordMinimumLength")} ${
settings ? settings.minLength : 8
} ${settings.digits ? t("Common:PasswordLimitDigits") : ""} ${
settings.upperCase ? t("Common:PasswordLimitUpperCase") : ""
} ${settings.specSymbols ? t("Common:PasswordLimitSpecialSymbols") : ""}`;
settings ? settings?.minLength : 8
} ${settings?.digits ? t("Common:PasswordLimitDigits") : ""} ${
settings?.upperCase ? t("Common:PasswordLimitUpperCase") : ""
} ${settings?.specSymbols ? t("Common:PasswordLimitSpecialSymbols") : ""}`;
};
export const getCategoryType = (location) => {

201
packages/client/src/pages/Confirm/index.js
View File

@ -1,5 +1,5 @@
import React, { lazy } from "react";
import { Switch } from "react-router-dom";
import { Routes, Route } from "react-router-dom";
import ConfirmRoute from "../../helpers/confirmRoute";
import ConfirmWrapper from "./ConfirmWrapper";
@ -22,78 +22,137 @@ const DeactivatePortal = lazy(() =>
const ContinuePortal = lazy(() => import("./sub-components/continuePortal"));
const Auth = lazy(() => import("./sub-components/auth"));
const Confirm = ({ match }) => {
const Confirm = () => {
//console.log("Confirm render");
const path = match.path;
return (
<>
<Switch>
<ConfirmRoute
forUnauthorized
path={`${path}/LinkInvite`}
component={CreateUserForm}
/>
<ConfirmRoute
forUnauthorized
path={`${path}/Activation`}
component={ActivateUserForm}
/>
<ConfirmRoute
exact
path={`${path}/EmailActivation`}
component={ActivateEmailForm}
/>
<ConfirmRoute
exact
path={`${path}/EmailChange`}
component={ChangeEmailForm}
/>
<ConfirmRoute
forUnauthorized
path={`${path}/PasswordChange`}
component={ChangePasswordForm}
/>
<ConfirmRoute
exact
path={`${path}/ProfileRemove`}
component={ProfileRemoveForm}
/>
<ConfirmRoute
exact
path={`${path}/PhoneActivation`}
component={ChangePhoneForm}
/>
<ConfirmRoute
exact
path={`${path}/PortalOwnerChange`}
component={ChangeOwnerForm}
/>
<ConfirmRoute exact path={`${path}/TfaAuth`} component={TfaAuthForm} />
<ConfirmRoute
exact
path={`${path}/TfaActivation`}
component={TfaActivationForm}
/>
<ConfirmRoute
exact
path={`${path}/PortalRemove`}
component={RemovePortal}
/>
<ConfirmRoute
exact
path={`${path}/PortalSuspend`}
component={DeactivatePortal}
/>
<ConfirmRoute
exact
path={`${path}/PortalContinue`}
component={ContinuePortal}
/>
<ConfirmRoute forUnauthorized path={`${path}/Auth`} component={Auth} />
{/* <Route component={Error404} /> */}
</Switch>
</>
return (
<Routes>
<Route
path={`LinkInvite`}
element={
<ConfirmRoute forUnauthorized>
<CreateUserForm />
</ConfirmRoute>
}
/>
<Route
path={`Activation`}
element={
<ConfirmRoute forUnauthorized>
<ActivateUserForm />
</ConfirmRoute>
}
/>
<Route
path={`EmailActivation`}
element={
<ConfirmRoute>
<ActivateEmailForm />
</ConfirmRoute>
}
/>
<Route
path={`EmailChange`}
element={
<ConfirmRoute>
<ChangeEmailForm />
</ConfirmRoute>
}
/>
<Route
path={`PasswordChange`}
element={
<ConfirmRoute forUnauthorized>
<ChangePasswordForm />
</ConfirmRoute>
}
/>
<Route
path={`ProfileRemove`}
element={
<ConfirmRoute>
<ProfileRemoveForm />
</ConfirmRoute>
}
/>
<Route
path={`PhoneActivation`}
element={
<ConfirmRoute>
<ChangePhoneForm />
</ConfirmRoute>
}
/>
<Route
path={`PortalOwnerChange`}
element={
<ConfirmRoute>
<ChangeOwnerForm />
</ConfirmRoute>
}
/>
<Route
path={`TfaAuth`}
element={
<ConfirmRoute>
<TfaAuthForm />
</ConfirmRoute>
}
/>
<Route
path={`TfaActivation`}
element={
<ConfirmRoute>
<TfaActivationForm />
</ConfirmRoute>
}
/>
<Route
path={`PortalRemove`}
element={
<ConfirmRoute>
<RemovePortal />
</ConfirmRoute>
}
/>
<Route
path={`PortalSuspend`}
element={
<ConfirmRoute>
<DeactivatePortal />
</ConfirmRoute>
}
/>
<Route
path={`PortalContinue`}
element={
<ConfirmRoute>
<ContinuePortal />
</ConfirmRoute>
}
/>
<Route
path={`Auth`}
element={
<ConfirmRoute forUnauthorized>
<Auth />
</ConfirmRoute>
}
/>
</Routes>
);
};

1
packages/client/src/pages/Confirm/sub-components/changeEmail.js
View File

@ -71,7 +71,6 @@ class ChangeEmail extends React.PureComponent {
}
ChangeEmail.propTypes = {
location: PropTypes.object.isRequired,
changeEmail: PropTypes.func.isRequired,
};
const ChangeEmailForm = (props) => (

2
packages/client/src/pages/Confirm/sub-components/continuePortal.js
View File

@ -29,7 +29,7 @@ const ContinuePortal = (props) => {
try {
await continuePortal(linkData.confirmHeader);
setIsReactivate(true);
setTimeout(() => (location.href = "/"), 10000);
setTimeout(() => (window.location.href = "/"), 10000);
} catch (e) {
toastr.error(e);
}

6
packages/client/src/pages/Confirm/sub-components/createUser.js
View File

@ -42,7 +42,7 @@ const CreateUserForm = (props) => {
const { settings, t, greetingTitle, providers, isDesktop, linkData } = props;
const inputRef = React.useRef(null);
const emailFromLink = linkData.email ? linkData.email : "";
const emailFromLink = linkData?.email ? linkData.email : "";
const [moreAuthVisible, setMoreAuthVisible] = useState(false);
const [ssoLabel, setSsoLabel] = useState("");
@ -636,10 +636,6 @@ const CreateUserForm = (props) => {
);
};
CreateUserForm.propTypes = {
location: PropTypes.object.isRequired,
};
export default inject(({ auth }) => {
const {
login,

2
packages/client/src/pages/Confirm/sub-components/deactivatePortal.js
View File

@ -33,7 +33,7 @@ const DeactivatePortal = (props) => {
try {
await suspendPortal(linkData.confirmHeader);
setIsDeactivate(true);
setTimeout(() => (location.href = url), 10000);
setTimeout(() => (window.location.href = url), 10000);
} catch (e) {
toastr.error(e);
}

12
packages/login/src/client/App.tsx
View File

@ -35,15 +35,9 @@ const App: React.FC<ILoginProps> = (props) => {
<MobxProvider {...loginStore}>
<SimpleNav {...props} />
<Routes>
<Route path="/login/error">
<InvalidRoute />
</Route>
<Route path="/login/code">
<CodeLogin {...props} />
</Route>
<Route path="/login">
<Login {...props} />
</Route>
<Route path="/login/error" element={<InvalidRoute />} />
<Route path="/login/code" element={<CodeLogin {...props} />} />
<Route path="/login" element={<Login {...props} />} />
</Routes>
</MobxProvider>
);