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

Web: PortalSettings: Backup: Fixed component display by direct url.

Browse Source
This commit is contained in:
Tatiana Lopaeva 2023-03-03 12:54:22 +03:00
parent 43dcb4dcd7
commit f8000cdc2a
3 changed files with 88 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

103
packages/client/src/pages/PortalSettings/categories/data-management/backup/index.js
View File

@ -1,103 +0,0 @@
import HelpReactSvgUrl from "PUBLIC_DIR/images/help.react.svg?url";
import React from "react";
import { withTranslation, Trans } from "react-i18next";
import Submenu from "@docspace/components/submenu";
import Link from "@docspace/components/link";
import HelpButton from "@docspace/components/help-button";
import { combineUrl } from "@docspace/common/utils";
import { inject, observer } from "mobx-react";
import AutoBackup from "./auto-backup";
import ManualBackup from "./manual-backup";
import config from "PACKAGE_FILE";
const Backup = ({
helpUrlCreatingBackup,
buttonSize,
t,
history,
isNotPaidPeriod,
currentColorScheme,
}) => {
const renderTooltip = (helpInfo) => {
return (
<>
<HelpButton
place="bottom"
iconName={HelpReactSvgUrl}
tooltipContent={
<>
<Trans t={t} i18nKey={`${helpInfo}`} ns="Settings">
{helpInfo}
</Trans>
<div>
<Link
as="a"
href={helpUrlCreatingBackup}
target="_blank"
color={currentColorScheme.main.accent}
isBold
isHovered
>
{t("Common:LearnMore")}
</Link>
</div>
</>
}
/>
</>
);
};
const data = [
{
id: "data-backup",
name: t("DataBackup"),
content: (
<ManualBackup buttonSize={buttonSize} renderTooltip={renderTooltip} />
),
},
{
id: "auto-backup",
name: t("AutoBackup"),
content: (
<AutoBackup buttonSize={buttonSize} renderTooltip={renderTooltip} />
),
},
];
const onSelect = (e) => {
history.push(
combineUrl(
window.DocSpaceConfig?.proxy?.url,
config.homepage,
`/portal-settings/backup/${e.id}`
)
);
};
return isNotPaidPeriod ? (
<ManualBackup buttonSize={buttonSize} renderTooltip={renderTooltip} />
) : (
<Submenu data={data} startSelect={data[0]} onSelect={(e) => onSelect(e)} />
);
};
export default inject(({ auth }) => {
const { settingsStore, currentTariffStatusStore } = auth;
const { isNotPaidPeriod } = currentTariffStatusStore;
const {
helpUrlCreatingBackup,
isTabletView,
currentColorScheme,
} = settingsStore;
const buttonSize = isTabletView ? "normal" : "small";
return {
helpUrlCreatingBackup,
buttonSize,
isNotPaidPeriod,
currentColorScheme,
};
})(observer(withTranslation(["Settings", "Common"])(Backup)));

100
packages/client/src/pages/PortalSettings/categories/data-management/index.js
View File

@ -1,31 +1,85 @@
import React, { useEffect, useState } from "react";
import Submenu from "@docspace/components/submenu";
import { withRouter } from "react-router";
import { withTranslation } from "react-i18next";
import { withTranslation, Trans } from "react-i18next";
import { inject, observer } from "mobx-react";
import { combineUrl } from "@docspace/common/utils";
import config from "../../../../../../package.json";
import Backup from "./backup";
import HelpReactSvgUrl from "PUBLIC_DIR/images/help.react.svg?url";
import Submenu from "@docspace/components/submenu";
import Link from "@docspace/components/link";
import HelpButton from "@docspace/components/help-button";
import { combineUrl } from "@docspace/common/utils";
import AppLoader from "@docspace/common/components/AppLoader";
import config from "../../../../../package.json";
import ManualBackup from "./backup/manual-backup";
import AutoBackup from "./backup/auto-backup";
const DataManagementWrapper = (props) => {
const { t, history } = props;
const {
helpUrlCreatingBackup,
buttonSize,
t,
history,
isNotPaidPeriod,
currentColorScheme,
} = props;
const [currentTab, setCurrentTab] = useState(0);
const [isLoading, setIsLoading] = useState(false);
const renderTooltip = (helpInfo) => {
return (
<>
<HelpButton
place="bottom"
iconName={HelpReactSvgUrl}
tooltipContent={
<>
<Trans t={t} i18nKey={`${helpInfo}`} ns="Settings">
{helpInfo}
</Trans>
<div>
<Link
as="a"
href={helpUrlCreatingBackup}
target="_blank"
color={currentColorScheme.main.accent}
isBold
isHovered
>
{t("Common:LearnMore")}
</Link>
</div>
</>
}
/>
</>
);
};
const data = [
{
id: "backup",
name: t("Backup"),
content: <Backup />,
id: "data-backup",
name: t("DataBackup"),
content: (
<ManualBackup buttonSize={buttonSize} renderTooltip={renderTooltip} />
),
},
{
id: "auto-backup",
name: t("AutoBackup"),
content: (
<AutoBackup buttonSize={buttonSize} renderTooltip={renderTooltip} />
),
},
];
useEffect(() => {
const path = location.pathname;
const currentTab = data.findIndex((item) => path.includes(item.id));
if (currentTab !== -1) setCurrentTab(currentTab);
setIsLoading(true);
}, []);
@ -34,13 +88,16 @@ const DataManagementWrapper = (props) => {
combineUrl(
window.DocSpaceConfig?.proxy?.url,
config.homepage,
`/settings/datamanagement/${e.id}`
`/portal-settings/backup/${e.id}`
)
);
};
if (!isLoading) return <AppLoader />;
return (
return isNotPaidPeriod ? (
<ManualBackup buttonSize={buttonSize} renderTooltip={renderTooltip} />
) : (
<Submenu
data={data}
startSelect={currentTab}
@ -49,12 +106,29 @@ const DataManagementWrapper = (props) => {
);
};
export default inject(({ setup }) => {
export default inject(({ auth, setup }) => {
const { initSettings } = setup;
const { settingsStore, currentTariffStatusStore } = auth;
const { isNotPaidPeriod } = currentTariffStatusStore;
const {
helpUrlCreatingBackup,
isTabletView,
currentColorScheme,
} = settingsStore;
const buttonSize = isTabletView ? "normal" : "small";
return {
loadBaseInfo: async () => {
await initSettings();
},
helpUrlCreatingBackup,
buttonSize,
isNotPaidPeriod,
currentColorScheme,
};
})(withTranslation("Settings")(withRouter(observer(DataManagementWrapper))));
})(
withTranslation(["Settings", "Common"])(
withRouter(observer(DataManagementWrapper))
)
);

2
packages/client/src/pages/PortalSettings/index.js
View File

@ -57,7 +57,7 @@ const SingleSignOn = lazy(() =>
import("./categories/integration/SingleSignOn")
);
const Backup = lazy(() => import("./categories/data-management/backup"));
const Backup = lazy(() => import("./categories/data-management/index"));
const RestoreBackup = lazy(() =>
import("./categories/data-management/backup/restore-backup/index")