eliott/anything-llm
1
0
Fork 0
mirror of https://github.com/Mintplex-Labs/anything-llm synced 2026-04-25 17:15:37 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'master' of github.com:Mintplex-Labs/anything-llm

Browse Source
This commit is contained in:
Timothy Carambat
2026-02-19 12:39:31 -08:00
parent 87b7c44840 e025df9b87
commit 907bd09faf
3 changed files with 41 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
frontend/src/LogoContext.jsx
View File

@@ -6,18 +6,21 @@ import DefaultLoginLogoDark from "./media/illustrations/login-logo-light.svg";
import System from "./models/system";
export const REFETCH_LOGO_EVENT = "refetch-logo";
function isLightMode() {
return document.documentElement.getAttribute("data-theme") === "light";
}
export const LogoContext = createContext();
export function LogoProvider({ children }) {
const [logo, setLogo] = useState("");
const [loginLogo, setLoginLogo] = useState("");
const [isCustomLogo, setIsCustomLogo] = useState(false);
const DefaultLoginLogo =
localStorage.getItem("theme") !== "default"
? DefaultLoginLogoDark
: DefaultLoginLogoLight;
async function fetchInstanceLogo() {
const DefaultLoginLogo = isLightMode()
? DefaultLoginLogoDark
: DefaultLoginLogoLight;
try {
const { isCustomLogo, logoURL } = await System.fetchLogo();
if (logoURL) {
@@ -25,16 +28,12 @@ export function LogoProvider({ children }) {
setLoginLogo(isCustomLogo ? logoURL : DefaultLoginLogo);
setIsCustomLogo(isCustomLogo);
} else {
localStorage.getItem("theme") !== "default"
? setLogo(AnythingLLMDark)
: setLogo(AnythingLLM);
isLightMode() ? setLogo(AnythingLLMDark) : setLogo(AnythingLLM);
setLoginLogo(DefaultLoginLogo);
setIsCustomLogo(false);
}
} catch (err) {
localStorage.getItem("theme") !== "default"
? setLogo(AnythingLLMDark)
: setLogo(AnythingLLM);
isLightMode() ? setLogo(AnythingLLMDark) : setLogo(AnythingLLM);
setLoginLogo(DefaultLoginLogo);
setIsCustomLogo(false);
console.error("Failed to fetch logo:", err);

19
frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/index.jsx
View File

@@ -360,20 +360,15 @@ function useIsDisabled() {
*/
useEffect(() => {
if (!window) return;
window.addEventListener(ATTACHMENTS_PROCESSING_EVENT, () =>
setIsDisabled(true)
);
window.addEventListener(ATTACHMENTS_PROCESSED_EVENT, () =>
setIsDisabled(false)
);
const onProcessing = () => setIsDisabled(true);
const onProcessed = () => setIsDisabled(false);
window.addEventListener(ATTACHMENTS_PROCESSING_EVENT, onProcessing);
window.addEventListener(ATTACHMENTS_PROCESSED_EVENT, onProcessed);
return () => {
window?.removeEventListener(ATTACHMENTS_PROCESSING_EVENT, () =>
setIsDisabled(true)
);
window?.removeEventListener(ATTACHMENTS_PROCESSED_EVENT, () =>
setIsDisabled(false)
);
window.removeEventListener(ATTACHMENTS_PROCESSING_EVENT, onProcessing);
window.removeEventListener(ATTACHMENTS_PROCESSED_EVENT, onProcessed);
};
}, []);

37
frontend/src/hooks/useTheme.js
View File

@@ -2,33 +2,46 @@ import { REFETCH_LOGO_EVENT } from "@/LogoContext";
import { useState, useEffect } from "react";
const availableThemes = {
default: "Default",
system: "System",
light: "Light",
dark: "Dark",
};
/**
* Determines the current theme of the application
* @returns {{theme: ('default' | 'light'), setTheme: function, availableThemes: object}} The current theme, a function to set the theme, and the available themes
* Determines the current theme of the application.
* "system" follows the OS preference, "light" and "dark" force that mode.
* @returns {{theme: ('system' | 'light' | 'dark'), setTheme: function, availableThemes: object}}
*/
export function useTheme() {
const [theme, _setTheme] = useState(() => {
return localStorage.getItem("theme") || "default";
const stored = localStorage.getItem("theme");
if (stored === "default") return "dark"; // migrate legacy value
return stored || "system";
});
const [systemTheme, setSystemTheme] = useState(() =>
window.matchMedia?.("(prefers-color-scheme: light)").matches
? "light"
: "dark"
);
// Listen for OS level theme changes
useEffect(() => {
if (localStorage.getItem("theme") !== null) return;
if (!window.matchMedia) return;
if (window.matchMedia("(prefers-color-scheme: light)").matches)
return _setTheme("light");
_setTheme("default");
const mql = window.matchMedia("(prefers-color-scheme: light)");
const handler = (e) => setSystemTheme(e.matches ? "light" : "dark");
mql.addEventListener("change", handler);
return () => mql.removeEventListener("change", handler);
}, []);
const resolvedTheme = theme === "system" ? systemTheme : theme;
useEffect(() => {
document.documentElement.setAttribute("data-theme", theme);
document.body.classList.toggle("light", theme === "light");
document.documentElement.setAttribute("data-theme", resolvedTheme);
document.body.classList.toggle("light", resolvedTheme === "light");
localStorage.setItem("theme", theme);
window.dispatchEvent(new Event(REFETCH_LOGO_EVENT));
}, [theme]);
}, [resolvedTheme, theme]);
// In development, attach keybind combinations to toggle theme
useEffect(() => {
@@ -36,7 +49,7 @@ export function useTheme() {
function toggleOnKeybind(e) {
if (e.metaKey && e.key === ".") {
e.preventDefault();
setTheme((prev) => (prev === "light" ? "default" : "light"));
_setTheme((prev) => (prev === "light" ? "dark" : "light"));
}
}
document.addEventListener("keydown", toggleOnKeybind);