refactor: workspace setting definitions

This commit is contained in:
Steven
2024-07-29 22:03:21 +08:00
parent 61d01a53eb
commit ecf77e0774
36 changed files with 1277 additions and 1052 deletions

View File

@ -1,5 +1,4 @@
import { useState } from "react";
import { useWorkspaceStore } from "@/stores";
import Icon from "./Icon";
interface Props {
@ -18,8 +17,7 @@ const getFaviconUrlWithProvider = (url: string, provider: string) => {
const LinkFavicon = (props: Props) => {
const { url } = props;
const workspaceStore = useWorkspaceStore();
const faviconProvider = workspaceStore.profile.faviconProvider || "https://www.google.com/s2/favicons";
const faviconProvider = "https://www.google.com/s2/favicons";
const [faviconUrl, setFaviconUrl] = useState<string>(getFaviconUrlWithProvider(url, faviconProvider));
const handleImgError = () => {

View File

@ -1,4 +1,4 @@
import { Button, Input, Link, Option, Select, Switch, Textarea } from "@mui/joy";
import { Button, Option, Select, Textarea } from "@mui/joy";
import { isEqual } from "lodash-es";
import { useRef, useState } from "react";
import toast from "react-hot-toast";
@ -7,7 +7,6 @@ import { workspaceServiceClient } from "@/grpcweb";
import { useWorkspaceStore } from "@/stores";
import { Visibility } from "@/types/proto/api/v1/common";
import { WorkspaceSetting } from "@/types/proto/api/v1/workspace_service";
import BetaBadge from "../BetaBadge";
const getDefaultVisibility = (visibility?: Visibility) => {
if (!visibility || [Visibility.VISIBILITY_UNSPECIFIED, Visibility.UNRECOGNIZED].includes(visibility)) {
@ -24,27 +23,6 @@ const WorkspaceSection = () => {
const originalWorkspaceSetting = useRef<WorkspaceSetting>(workspaceStore.setting);
const allowSave = !isEqual(originalWorkspaceSetting.current, workspaceSetting);
const handleEnableSignUpChange = async (value: boolean) => {
setWorkspaceSetting({
...workspaceSetting,
enableSignup: value,
});
};
const handleInstanceUrlChange = async (value: string) => {
setWorkspaceSetting({
...workspaceSetting,
instanceUrl: value,
});
};
const handleFaviconProvierChange = async (value: string) => {
setWorkspaceSetting({
...workspaceSetting,
faviconProvider: value,
});
};
const handleCustomStyleChange = async (value: string) => {
setWorkspaceSetting({
...workspaceSetting,
@ -61,21 +39,12 @@ const WorkspaceSection = () => {
const handleSaveWorkspaceSetting = async () => {
const updateMask: string[] = [];
if (!isEqual(originalWorkspaceSetting.current.enableSignup, workspaceSetting.enableSignup)) {
updateMask.push("enable_signup");
}
if (!isEqual(originalWorkspaceSetting.current.instanceUrl, workspaceSetting.instanceUrl)) {
updateMask.push("instance_url");
}
if (!isEqual(originalWorkspaceSetting.current.customStyle, workspaceSetting.customStyle)) {
updateMask.push("custom_style");
}
if (!isEqual(originalWorkspaceSetting.current.defaultVisibility, workspaceSetting.defaultVisibility)) {
updateMask.push("default_visibility");
}
if (!isEqual(originalWorkspaceSetting.current.faviconProvider, workspaceSetting.faviconProvider)) {
updateMask.push("favicon_provider");
}
if (updateMask.length === 0) {
toast.error("No changes made");
return;
@ -101,33 +70,6 @@ const WorkspaceSection = () => {
<div className="w-full flex flex-col sm:flex-row justify-start items-start gap-4 sm:gap-x-16">
<p className="sm:w-1/4 text-2xl shrink-0 font-semibold text-gray-900 dark:text-gray-500">{t("settings.workspace.self")}</p>
<div className="w-full sm:w-auto grow flex flex-col justify-start items-start gap-4">
<div className="w-full flex flex-col justify-start items-start">
<div className="w-full flex flex-col justify-start items-start">
<p className="font-medium dark:text-gray-400">Instance URL</p>
<p className="text-sm text-gray-500 leading-tight">
{"Mainly used for SEO and social sharing. Leave empty to disallow crawlers."}
</p>
</div>
<Input
className="w-full mt-2"
placeholder="Your instance URL. e.g. https://slash.example.com"
value={workspaceSetting.instanceUrl}
onChange={(event) => handleInstanceUrlChange(event.target.value)}
/>
</div>
<div className="w-full flex flex-row justify-between items-center">
<div className="w-full flex flex-col justify-start items-start">
<p className="font-medium dark:text-gray-400">{t("settings.workspace.enable-user-signup.self")}</p>
<p className="text-sm text-gray-500">{t("settings.workspace.enable-user-signup.description")}</p>
</div>
<div>
<Switch
size="lg"
checked={workspaceSetting.enableSignup}
onChange={(event) => handleEnableSignUpChange(event.target.checked)}
/>
</div>
</div>
<div className="w-full flex flex-row justify-between items-center">
<div className="w-full flex flex-col justify-start items-start">
<p className="font-medium dark:text-gray-400">{t("settings.workspace.default-visibility")}</p>
@ -143,24 +85,6 @@ const WorkspaceSection = () => {
<Option value={Visibility.PUBLIC}>{t(`shortcut.visibility.public.self`)}</Option>
</Select>
</div>
<div className="w-full flex flex-col justify-start items-start">
<div className="w-full flex flex-row justify-start items-center gap-2">
<p className="font-medium dark:text-gray-400">Favicon provider</p>
<BetaBadge />
</div>
<p className="text-sm text-gray-500">
e.g.{" "}
<Link className="!text-sm" href="https://github.com/yourselfhosted/favicons" target="_blank">
yourselfhosted/favicons
</Link>
</p>
<Input
className="w-full mt-2"
placeholder="The provider of favicon. Empty for default Google S2."
value={workspaceSetting.faviconProvider}
onChange={(event) => handleFaviconProvierChange(event.target.value)}
/>
</div>
<div className="w-full flex flex-col justify-start items-start">
<p className="mt-2 font-medium dark:text-gray-400">{t("settings.workspace.custom-style")}</p>
<Textarea

View File

@ -121,7 +121,7 @@ const useUserStore = create<UserState>()((set, get) => ({
return userSetting;
},
updateUserSetting: async (userSetting: UserSetting, updateMask: string[]) => {
const userId = userSetting.id;
const userId = userSetting.userId;
const updatedUserSetting = (
await userSettingServiceClient.updateUserSetting({
id: userId,
@ -129,11 +129,6 @@ const useUserStore = create<UserState>()((set, get) => ({
updateMask,
})
).userSetting as UserSetting;
console.log("1", {
id: userId,
userSetting,
updateMask,
});
const userSettingMap = get().userSettingMapById;
userSettingMap[userId] = updatedUserSetting;
set(userSettingMap);