feat: refactor agreement modal and create folders to classify components (#1686)

* refactor: refactor agreement modal and create folders to classify components

* fix: i18

* fix: i18

* fix: i18n
This commit is contained in:
Yaodong Yu
2023-03-26 18:44:47 +08:00
committed by GitHub
parent 32b05047dc
commit a8937d3046
49 changed files with 628 additions and 488 deletions

View File

@ -21,12 +21,13 @@ import i18next from "i18next";
import * as Util from "./Util";
import {authConfig} from "./Auth";
import * as ApplicationBackend from "../backend/ApplicationBackend";
import * as AgreementModal from "../common/modal/AgreementModal";
import {SendCodeInput} from "../common/SendCodeInput";
import SelectRegionBox from "../SelectRegionBox";
import CustomGithubCorner from "../CustomGithubCorner";
import SelectLanguageBox from "../SelectLanguageBox";
import RegionSelect from "../common/select/RegionSelect";
import CustomGithubCorner from "../common/CustomGithubCorner";
import LanguageSelect from "../common/select/LanguageSelect";
import {withRouter} from "react-router-dom";
import {CountryCodeSelect} from "../common/CountryCodeSelect";
import {CountryCodeSelect} from "../common/select/CountryCodeSelect";
const formItemLayout = {
labelCol: {
@ -47,7 +48,7 @@ const formItemLayout = {
},
};
const tailFormItemLayout = {
export const tailFormItemLayout = {
wrapperCol: {
xs: {
span: 24,
@ -105,12 +106,6 @@ class SignupPage extends React.Component {
ApplicationBackend.getApplication("admin", applicationName)
.then((application) => {
this.onUpdateApplication(application);
if (application !== null && application !== undefined) {
Setting.getTermsOfUseContent(application.termsOfUse, res => {
this.setState({termsOfUseContent: res});
});
}
});
}
@ -311,7 +306,7 @@ class SignupPage extends React.Component {
},
]}
>
<SelectRegionBox onChange={(value) => {this.setState({region: value});}} />
<RegionSelect onChange={(value) => {this.setState({region: value});}} />
</Form.Item>
);
} else if (signupItem.name === "Email") {
@ -477,32 +472,10 @@ class SignupPage extends React.Component {
</Form.Item>
);
} else if (signupItem.name === "Agreement") {
return (
Setting.renderAgreement(Setting.isAgreementRequired(application), () => {
this.setState({
isTermsOfUseVisible: true,
});
}, false, tailFormItemLayout, Setting.isDefaultTrue(application))
);
return AgreementModal.renderAgreementFormItem(application, required, tailFormItemLayout, this);
}
}
renderModal() {
return (
Setting.renderModal(this.state.isTermsOfUseVisible, () => {
this.form.current.setFieldsValue({agreement: true});
this.setState({
isTermsOfUseVisible: false,
});
}, () => {
this.form.current.setFieldsValue({agreement: false});
this.setState({
isTermsOfUseVisible: false,
});
}, this.state.termsOfUseContent)
);
}
renderForm(application) {
if (!application.enableSignUp) {
return (
@ -615,16 +588,13 @@ class SignupPage extends React.Component {
{
Setting.renderLogo(application)
}
<SelectLanguageBox languages={application.organizationObj.languages} style={{top: "55px", right: "5px", position: "absolute"}} />
<LanguageSelect languages={application.organizationObj.languages} style={{top: "55px", right: "5px", position: "absolute"}} />
{
this.renderForm(application)
}
</div>
</div>
</div>
{
this.renderModal()
}
</React.Fragment>
);
}