Web: Client: fix not applying color after changing color scheme

This commit is contained in:
Aleksandr Lushkin 2023-10-11 19:05:11 +02:00
parent 4abeffd43b
commit 7d0d9dba11
2 changed files with 11 additions and 5 deletions

View File

@ -594,7 +594,7 @@ const Appearance = (props) => {
id="buttons-hex" id="buttons-hex"
onCloseHexColorPicker={onCloseHexColorPickerButtons} onCloseHexColorPicker={onCloseHexColorPickerButtons}
onAppliedColor={onAppliedColorButtons} onAppliedColor={onAppliedColorButtons}
startColor={appliedColorButtons} appliedColor={appliedColorButtons}
/> />
</DropDownItem> </DropDownItem>
</DropDownContainer> </DropDownContainer>
@ -614,7 +614,7 @@ const Appearance = (props) => {
id="accent-hex" id="accent-hex"
onCloseHexColorPicker={onCloseHexColorPickerAccent} onCloseHexColorPicker={onCloseHexColorPickerAccent}
onAppliedColor={onAppliedColorAccent} onAppliedColor={onAppliedColorAccent}
startColor={appliedColorAccent} appliedColor={appliedColorAccent}
/> />
</DropDownItem> </DropDownItem>
</DropDownContainer> </DropDownContainer>

View File

@ -1,4 +1,4 @@
import React, { useState } from "react"; import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import styled, { css } from "styled-components"; import styled, { css } from "styled-components";
import Button from "@docspace/components/button"; import Button from "@docspace/components/button";
@ -113,12 +113,18 @@ const StyledComponent = styled.div`
`; `;
const HexColorPickerComponent = (props) => { const HexColorPickerComponent = (props) => {
const { onCloseHexColorPicker, onAppliedColor, startColor } = props; const { onCloseHexColorPicker, onAppliedColor, appliedColor } = props;
const [color, setColor] = useState(startColor); const [color, setColor] = useState(appliedColor);
const { t } = useTranslation("Common"); const { t } = useTranslation("Common");
useEffect(() => {
if (color !== appliedColor) {
setColor(appliedColor);
}
}, [appliedColor]);
return ( return (
<StyledComponent> <StyledComponent>
<div className="hex-color-picker"> <div className="hex-color-picker">