Client: PortalSettings: WhiteLabel: move logo to component

This commit is contained in:
Viktor Fomin 2022-11-18 01:38:05 +05:00
parent 5e13be9b35
commit 2436f81935
2 changed files with 60 additions and 59 deletions

View File

@ -0,0 +1,44 @@
import React from "react";
import Text from "@docspace/components/text";
import Link from "@docspace/components/link";
const Logo = (props) => {
const {
title,
src,
onChange,
isSettingPaid,
onChangeText,
inputId,
imageClass,
} = props;
return (
<div>
<div className="logo-item">
<Text fontSize="13px" fontWeight="600">
{title}
</Text>
<img className={imageClass} src={src} />
</div>
<label>
<input
id={inputId}
type="file"
className="hidden"
//onChange={onChange}
disabled={!isSettingPaid}
/>
<Link
fontWeight="600"
isHovered
type="action"
className="settings_unavailable"
>
{onChangeText}
</Link>
</label>
</div>
);
};
export default Logo;

View File

@ -13,6 +13,8 @@ import Link from "@docspace/components/link";
import WhiteLabelWrapper from "./StyledWhitelabel";
import LoaderWhiteLabel from "../sub-components/loaderWhiteLabel";
import Logo from "./sub-components/logo";
const WhiteLabel = (props) => {
const { t, isSettingPaid, logoText, logoUrls } = props;
const [isLoadedData, setIsLoadedData] = useState(false);
@ -107,65 +109,20 @@ const WhiteLabel = (props) => {
{t("LogoLightSmall")}
</Text>
<div className="logos-wrapper">
<div>
<div className="logo-item">
<Text fontSize="13px" fontWeight="600">
Light theme
</Text>
<img
className="logo-header"
src={logoUrlsWhiteLabel[0]}
alt={t("LogoLightSmall")}
/>
</div>
<label>
<input
id="logoUploader_1"
type="file"
className="hidden"
//onChange={onChangeLogo}
disabled={!isSettingPaid}
/>
<Link
fontWeight="600"
isHovered
type="action"
className="settings_unavailable"
>
{t("ChangeLogoButton")}
</Link>
</label>
</div>
<div>
<div className="logo-item">
<Text fontSize="13px" fontWeight="600">
Dark theme
</Text>
<img
className="logo-header"
src={logoUrlsWhiteLabel[0]}
alt={t("LogoLightSmall")}
/>
</div>
<label>
<input
id="logoUploader_1"
type="file"
className="hidden"
//onChange={onChangeLogo}
disabled={!isSettingPaid}
/>
<Link
fontWeight="600"
isHovered
type="action"
className="settings_unavailable"
>
{t("ChangeLogoButton")}
</Link>
</label>
</div>
<Logo
title="Light theme"
src={logoUrlsWhiteLabel[0]}
imageClass="logo-header"
inputId="logoUploader_1"
onChangeText={t("ChangeLogoButton")}
/>
<Logo
title="Dark theme"
src={logoUrlsWhiteLabel[0]}
imageClass="logo-header"
inputId="logoUploader_1"
onChangeText={t("ChangeLogoButton")}
/>
</div>
</div>
</div>