jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Refactor profile picture chooser component to support dark mode

Browse source
This commit is contained in:
anovazzi1 2024-06-08 11:40:19 -03:00
commit c9e591a492
2 changed files with 9 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/frontend/src/index.tsx
View file

@ -12,13 +12,11 @@ import { StrictMode } from "react";
import "./style/classes.css"; import "./style/classes.css";
const root = ReactDOM.createRoot( const root = ReactDOM.createRoot(
document.getElementById("root") as HTMLElement document.getElementById("root") as HTMLElement,
); );
root.render( root.render(
<StrictMode> <ContextWrapper>
<ContextWrapper> <App />
<App /> </ContextWrapper>,
</ContextWrapper>
</StrictMode>
); );
reportWebVitals(); reportWebVitals();

6
src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/ProfilePictureForm/components/profilePictureChooserComponent/index.tsx
View file

@ -12,6 +12,7 @@ import LoadingComponent from "../../../../../../../../components/loadingComponen
import Loading from "../../../../../../../../components/ui/loading"; import Loading from "../../../../../../../../components/ui/loading";
import { cn } from "../../../../../../../../utils/utils"; import { cn } from "../../../../../../../../utils/utils";
import { Button } from "../../../../../../../../components/ui/button"; import { Button } from "../../../../../../../../components/ui/button";
import { useDarkStore } from "../../../../../../../../stores/darkStore";
type ProfilePictureChooserComponentProps = { type ProfilePictureChooserComponentProps = {
profilePictures: { [key: string]: string[] }; profilePictures: { [key: string]: string[] };
@ -27,6 +28,7 @@ export default function ProfilePictureChooserComponent({
onChange, onChange,
}: ProfilePictureChooserComponentProps) { }: ProfilePictureChooserComponentProps) {
const ref = useRef<HTMLButtonElement>(null); const ref = useRef<HTMLButtonElement>(null);
const dark = useDarkStore((state) => state.dark);
useEffect(() => { useEffect(() => {
if (value && ref) { if (value && ref) {
@ -63,7 +65,9 @@ export default function ProfilePictureChooserComponent({
style={{ style={{
filter: filter:
value === folder + "/" + path value === folder + "/" + path
? "drop-shadow(0 0 0.3rem rgb(255, 255, 255))" ? dark
? "drop-shadow(0 0 0.3rem rgb(255, 255, 255))"
: "drop-shadow(0 0 0.3rem rgb(0, 0, 0))"
: "", : "",
}} }}
className={cn("h-12 w-12")} className={cn("h-12 w-12")}