github/plane
0
0
Fork 1
mirror of https://github.com/makeplane/plane synced 2024-06-14 14:31:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: updated page error messages and theme in command palette

Browse Source
This commit is contained in:
gurusainath 2024-05-06 18:19:24 +05:30
parent e95cd1e385
commit e4e4076c3a
9 changed files with 114 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
apiserver/plane/authentication/views/app/email.py
View File

@ -111,6 +111,7 @@ class SignInAuthEndpoint(View):
return HttpResponseRedirect(url)
except AuthenticationException as e:
params = {
"email": email,
"error_code": str(e.error_code),
"error_message": str(e.error_message),
}

10
web/components/account/auth-forms/sign-in-root.tsx
View File

@ -48,7 +48,15 @@ export const SignInAuthRoot = observer(() => {
error_code?.toString() as EAuthenticationErrorCodes,
error_message?.toString()
);
if (errorhandler) setErrorInfo(errorhandler);
if (errorhandler) {
if (errorhandler?.type === EErrorAlertType.TOAST_ALERT) {
setToast({
type: TOAST_TYPE.ERROR,
title: errorhandler?.title,
message: errorhandler?.message as string,
});
} else setErrorInfo(errorhandler);
}
}
}, [error_code, error_message]);

10
web/components/account/auth-forms/sign-up-root.tsx
View File

@ -52,7 +52,15 @@ export const SignUpAuthRoot: FC = observer(() => {
error_code?.toString() as EAuthenticationErrorCodes,
error_message?.toString()
);
if (errorhandler) setErrorInfo(errorhandler);
if (errorhandler) {
if (errorhandler?.type === EErrorAlertType.TOAST_ALERT) {
setToast({
type: TOAST_TYPE.ERROR,
title: errorhandler?.title,
message: errorhandler?.message as string,
});
} else setErrorInfo(errorhandler);
}
}
}, [error_code, error_message]);

26
web/components/command-palette/actions/theme-actions.tsx
View File

@ -2,10 +2,12 @@ import React, { FC, useEffect, useState } from "react";
import { Command } from "cmdk";
import { observer } from "mobx-react";
import { useTheme } from "next-themes";
// icons
import { Settings } from "lucide-react";
import { TOAST_TYPE, setToast } from "@plane/ui";
// constants
import { THEME_OPTIONS } from "@/constants/themes";
// hooks
import { useUserProfile } from "@/hooks/store";
type Props = {
closePalette: () => void;
@ -13,20 +15,20 @@ type Props = {
export const CommandPaletteThemeActions: FC<Props> = observer((props) => {
const { closePalette } = props;
const { setTheme } = useTheme();
// hooks
const { updateUserTheme } = useUserProfile();
// states
const [mounted, setMounted] = useState(false);
// hooks
const { setTheme } = useTheme();
const updateUserTheme = async (newTheme: string) => {
const updateTheme = async (newTheme: string) => {
setTheme(newTheme);
// return updateUserProfile({ theme: newTheme }).catch(() => {
// setToast({
// type: TOAST_TYPE.ERROR,
// title: "Failed to save user theme settings!",
// });
// });
return updateUserTheme({ theme: newTheme }).catch(() => {
setToast({
type: TOAST_TYPE.ERROR,
title: "Failed to save user theme settings!",
});
});
};
// useEffect only runs on the client, so now we can safely show the UI
@ -42,7 +44,7 @@ export const CommandPaletteThemeActions: FC<Props> = observer((props) => {
<Command.Item
key={theme.value}
onSelect={() => {
updateUserTheme(theme.value);
updateTheme(theme.value);
closePalette();
}}
className="focus:outline-none"

105
web/helpers/authentication.helper.ts
View File

@ -1,3 +1,5 @@
import { ReactNode } from "react";
export enum EPageTypes {
"PUBLIC" = "PUBLIC",
"NON_AUTHENTICATED" = "NON_AUTHENTICATED",
@ -35,11 +37,6 @@ export enum EAuthenticationErrorCodes {
REQUIRED_EMAIL_PASSWORD_FIRST_NAME = "REQUIRED_EMAIL_PASSWORD_FIRST_NAME",
REQUIRED_EMAIL_PASSWORD = "REQUIRED_EMAIL_PASSWORD",
EMAIL_CODE_REQUIRED = "EMAIL_CODE_REQUIRED",
// inline local errors
INLINE_EMAIL = "INLINE_EMAIL",
INLINE_PASSWORD = "INLINE_PASSWORD",
INLINE_FIRST_NAME = "INLINE_FIRST_NAME",
INLINE_EMAIL_CODE = "INLINE_EMAIL_CODE",
}
export enum EErrorAlertType {
@ -51,7 +48,64 @@ export enum EErrorAlertType {
INLINE_EMAIL_CODE = "INLINE_EMAIL_CODE",
}
export type TAuthErrorInfo = { type: EErrorAlertType; message: string };
export type TAuthErrorInfo = { type: EErrorAlertType; title: string; message: ReactNode };
const errorCodeMessages: { [key in EAuthenticationErrorCodes]: { title: string; message: ReactNode } } = {
[EAuthenticationErrorCodes.INSTANCE_NOT_CONFIGURED]: {
title: `Instance not configured`,
message: `Instance not configured. Please contact your administrator.`,
},
[EAuthenticationErrorCodes.SMTP_NOT_CONFIGURED]: {
title: `SMTP not configured`,
message: `SMTP not configured. Please contact your administrator.`,
},
[EAuthenticationErrorCodes.AUTHENTICATION_FAILED]: {
title: `Authentication failed.`,
message: `Authentication failed. Please try again.`,
},
[EAuthenticationErrorCodes.INVALID_TOKEN]: { title: `Invalid token.`, message: `Invalid token. Please try again.` },
[EAuthenticationErrorCodes.EXPIRED_TOKEN]: { title: `Expired token.`, message: `Expired token. Please try again.` },
[EAuthenticationErrorCodes.IMPROPERLY_CONFIGURED]: {
title: `Improperly configured.`,
message: `Improperly configured. Please contact your administrator.`,
},
[EAuthenticationErrorCodes.OAUTH_PROVIDER_ERROR]: {
title: `OAuth provider error.`,
message: `OAuth provider error. Please try again.`,
},
[EAuthenticationErrorCodes.INVALID_EMAIL]: {
title: `Invalid email.`,
message: `Invalid email. Please try again.`,
},
[EAuthenticationErrorCodes.INVALID_PASSWORD]: {
title: `Invalid password.`,
message: `Invalid password. Please try again.`,
},
[EAuthenticationErrorCodes.USER_DOES_NOT_EXIST]: {
title: `User does not exist.`,
message: `User does not exist. Please try again.`,
},
[EAuthenticationErrorCodes.ADMIN_ALREADY_EXIST]: {
title: `Admin already exists.`,
message: `Admin already exists. Please try again.`,
},
[EAuthenticationErrorCodes.USER_ALREADY_EXIST]: {
title: `User already exists.`,
message: `User already exists. Please try again.`,
},
[EAuthenticationErrorCodes.REQUIRED_EMAIL_PASSWORD_FIRST_NAME]: {
title: `Missing fields.`,
message: `Email, password, and first name are required.`,
},
[EAuthenticationErrorCodes.REQUIRED_EMAIL_PASSWORD]: {
title: `Missing fields.`,
message: `Email and password are required.`,
},
[EAuthenticationErrorCodes.EMAIL_CODE_REQUIRED]: {
title: `Missing fields.`,
message: `Email and code are required.`,
},
};
export const authErrorHandler = (
errorCode: EAuthenticationErrorCodes,
@ -67,49 +121,28 @@ export const authErrorHandler = (
EAuthenticationErrorCodes.OAUTH_PROVIDER_ERROR,
];
const bannerAlertErrorCodes = [
EAuthenticationErrorCodes.INVALID_EMAIL,
EAuthenticationErrorCodes.INVALID_PASSWORD,
EAuthenticationErrorCodes.USER_DOES_NOT_EXIST,
EAuthenticationErrorCodes.ADMIN_ALREADY_EXIST,
EAuthenticationErrorCodes.USER_ALREADY_EXIST,
EAuthenticationErrorCodes.REQUIRED_EMAIL_PASSWORD_FIRST_NAME,
EAuthenticationErrorCodes.REQUIRED_EMAIL_PASSWORD,
EAuthenticationErrorCodes.EMAIL_CODE_REQUIRED,
];
const inlineFirstNameErrorCodes = [EAuthenticationErrorCodes.INLINE_FIRST_NAME];
const inlineEmailErrorCodes = [EAuthenticationErrorCodes.INLINE_EMAIL];
const inlineEmailCodeErrorCodes = [EAuthenticationErrorCodes.INLINE_EMAIL_CODE];
const inlinePasswordErrorCodes = [EAuthenticationErrorCodes.INLINE_PASSWORD];
if (toastAlertErrorCodes.includes(errorCode))
return {
type: EErrorAlertType.TOAST_ALERT,
message: errorMessage || "Something went wrong. Please try again.",
title: errorCodeMessages[errorCode]?.title || "Error",
message: errorMessage || errorCodeMessages[errorCode]?.message || "Something went wrong. Please try again.",
};
if (bannerAlertErrorCodes.includes(errorCode))
return {
type: EErrorAlertType.BANNER_ALERT,
message: errorMessage || "Something went wrong. Please try again.",
};
if (inlineFirstNameErrorCodes.includes(errorCode))
return {
type: EErrorAlertType.INLINE_FIRST_NAME,
message: errorMessage || "Something went wrong. Please try again.",
};
if (inlineEmailErrorCodes.includes(errorCode))
return {
type: EErrorAlertType.INLINE_EMAIL,
message: errorMessage || "Something went wrong. Please try again.",
};
if (inlinePasswordErrorCodes.includes(errorCode))
return {
type: EErrorAlertType.INLINE_PASSWORD,
message: errorMessage || "Something went wrong. Please try again.",
};
if (inlineEmailCodeErrorCodes.includes(errorCode))
return {
type: EErrorAlertType.INLINE_EMAIL_CODE,
message: errorMessage || "Something went wrong. Please try again.",
title: errorCodeMessages[errorCode]?.title || "Error",
message: errorMessage || errorCodeMessages[errorCode]?.message || "Something went wrong. Please try again.",
};
return undefined;

13
web/layouts/settings-layout/profile/sidebar.tsx
View File

@ -2,8 +2,6 @@ import { useEffect, useRef, useState } from "react";
import { observer } from "mobx-react";
import Link from "next/link";
import { useRouter } from "next/router";
import { useTheme } from "next-themes";
import { mutate } from "swr";
// icons
import { ChevronLeft, LogOut, MoveLeft, Plus, UserPlus } from "lucide-react";
// ui
@ -11,7 +9,7 @@ import { TOAST_TYPE, Tooltip, setToast } from "@plane/ui";
// constants
import { PROFILE_ACTION_LINKS } from "@/constants/profile";
// hooks
import { useAppTheme, useUser, useWorkspace } from "@/hooks/store";
import { useAppTheme, useUser, useUserSettings, useWorkspace } from "@/hooks/store";
import useOutsideClickDetector from "@/hooks/use-outside-click-detector";
import { usePlatformOS } from "@/hooks/use-platform-os";
@ -35,22 +33,19 @@ export const ProfileLayoutSidebar = observer(() => {
const [isSigningOut, setIsSigningOut] = useState(false);
// router
const router = useRouter();
// next themes
const { setTheme } = useTheme();
// store hooks
const { sidebarCollapsed, toggleSidebar } = useAppTheme();
const { data: currentUser, signOut } = useUser();
// const { currentUserSettings } = useUser();
const { data: currentUserSettings } = useUserSettings();
const { workspaces } = useWorkspace();
const { isMobile } = usePlatformOS();
const workspacesList = Object.values(workspaces ?? {});
// redirect url for normal mode
// FIXME:
const redirectWorkspaceSlug =
// currentUserSettings?.workspace?.last_workspace_slug ||
// currentUserSettings?.workspace?.fallback_workspace_slug ||
currentUserSettings?.workspace?.last_workspace_slug ||
currentUserSettings?.workspace?.fallback_workspace_slug ||
"";
const ref = useRef<HTMLDivElement>(null);

6
web/services/auth.service.ts
View File

@ -25,13 +25,15 @@ export class AuthService extends APIService {
});
}
signUpEmailCheck = async (data: IEmailCheckData): Promise<IEmailCheckResponse> => this.post("/auth/sign-up/email-check/", data, { headers: {} })
signUpEmailCheck = async (data: IEmailCheckData): Promise<IEmailCheckResponse> =>
this.post("/auth/sign-up/email-check/", data, { headers: {} })
.then((response) => response?.data)
.catch((error) => {
throw error?.response?.data;
});
signInEmailCheck = async (data: IEmailCheckData): Promise<IEmailCheckResponse> => this.post("/auth/sign-in/email-check/", data, { headers: {} })
signInEmailCheck = async (data: IEmailCheckData): Promise<IEmailCheckResponse> =>
this.post("/auth/sign-in/email-check/", data, { headers: {} })
.then((response) => response?.data)
.catch((error) => {
throw error?.response?.data;

3
web/store/root.store.ts
View File

@ -77,6 +77,9 @@ export class RootStore {
}
resetOnSignOut() {
// handling the system theme when user logged out from the app
localStorage.setItem("theme", "system");
this.workspaceRoot = new WorkspaceRootStore(this);
this.projectRoot = new ProjectRootStore(this);
this.memberRoot = new MemberRootStore(this);

2
web/store/user/index.ts
View File

@ -54,7 +54,7 @@ export class UserStore implements IUserStore {
constructor(private store: RootStore) {
// stores
this.userProfile = new ProfileStore();
this.userProfile = new ProfileStore(store);
this.userSettings = new UserSettingsStore();
this.membership = new UserMembershipStore(store);
// service