forked from Mintplex-Labs/anything-llm
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[FEAT] Custom login screen icon + custom app name (Mintplex-Labs#1500)
* implement custom icon on login screen for single & multi user + custom app name feature * hide field when not relevant * set customApp name * show original anythingllm login logo unless custom logo is set * nit-picks * remove console log --------- Co-authored-by: timothycarambat <[email protected]>
- Loading branch information
1 parent
a898127
commit 6a2d7ac
Showing
12 changed files
with
225 additions
and
25 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
100 changes: 100 additions & 0 deletions
100
frontend/src/pages/GeneralSettings/Appearance/CustomAppName/index.jsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,100 @@ | ||
| import Admin from "@/models/admin"; | ||
| import System from "@/models/system"; | ||
| import showToast from "@/utils/toast"; | ||
| import { useEffect, useState } from "react"; | ||
|
|
||
| export default function CustomAppName() { | ||
| const [loading, setLoading] = useState(true); | ||
| const [hasChanges, setHasChanges] = useState(false); | ||
| const [customAppName, setCustomAppName] = useState(""); | ||
| const [originalAppName, setOriginalAppName] = useState(""); | ||
| const [canCustomize, setCanCustomize] = useState(false); | ||
|
|
||
| useEffect(() => { | ||
| const fetchInitialParams = async () => { | ||
| const settings = await System.keys(); | ||
| if (!settings?.MultiUserMode && !settings?.RequiresAuth) { | ||
| setCanCustomize(false); | ||
| return false; | ||
| } | ||
|
|
||
| const { appName } = await System.fetchCustomAppName(); | ||
| setCustomAppName(appName || ""); | ||
| setOriginalAppName(appName || ""); | ||
| setCanCustomize(true); | ||
| setLoading(false); | ||
| }; | ||
| fetchInitialParams(); | ||
| }, []); | ||
|
|
||
| const updateCustomAppName = async (e, newValue = null) => { | ||
| e.preventDefault(); | ||
| let custom_app_name = newValue; | ||
| if (newValue === null) { | ||
| const form = new FormData(e.target); | ||
| custom_app_name = form.get("customAppName"); | ||
| } | ||
| const { success, error } = await Admin.updateSystemPreferences({ | ||
| custom_app_name, | ||
| }); | ||
| if (!success) { | ||
| showToast(`Failed to update custom app name: ${error}`, "error"); | ||
| return; | ||
| } else { | ||
| showToast("Successfully updated custom app name.", "success"); | ||
| window.localStorage.removeItem(System.cacheKeys.customAppName); | ||
| setCustomAppName(custom_app_name); | ||
| setOriginalAppName(custom_app_name); | ||
| setHasChanges(false); | ||
| } | ||
| }; | ||
|
|
||
| const handleChange = (e) => { | ||
| setCustomAppName(e.target.value); | ||
| setHasChanges(true); | ||
| }; | ||
|
|
||
| if (!canCustomize || loading) return null; | ||
|
|
||
| return ( | ||
| <form className="mb-6" onSubmit={updateCustomAppName}> | ||
| <div className="flex flex-col gap-y-1"> | ||
| <h2 className="text-base leading-6 font-bold text-white"> | ||
| Custom App Name | ||
| </h2> | ||
| <p className="text-xs leading-[18px] font-base text-white/60"> | ||
| Set a custom app name that is displayed on the login page. | ||
| </p> | ||
| </div> | ||
| <div className="flex items-center gap-x-4"> | ||
| <input | ||
| name="customAppName" | ||
| type="text" | ||
| className="bg-zinc-900 mt-3 text-white text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 max-w-[275px] placeholder:text-white/20" | ||
| placeholder="AnythingLLM" | ||
| required={true} | ||
| autoComplete="off" | ||
| onChange={handleChange} | ||
| value={customAppName} | ||
| /> | ||
| {originalAppName !== "" && ( | ||
| <button | ||
| type="button" | ||
| onClick={(e) => updateCustomAppName(e, "")} | ||
| className="mt-4 text-white text-base font-medium hover:text-opacity-60" | ||
| > | ||
| Clear | ||
| </button> | ||
| )} | ||
| </div> | ||
| {hasChanges && ( | ||
| <button | ||
| type="submit" | ||
| className="transition-all mt-6 w-fit duration-300 border border-slate-200 px-5 py-2.5 rounded-lg text-white text-sm items-center flex gap-x-2 hover:bg-slate-200 hover:text-slate-800 focus:ring-gray-800" | ||
| > | ||
| Save | ||
| </button> | ||
| )} | ||
| </form> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.