[WEB-4623] chore: upgrade modal improvement and code refactor (#3815)

* chore: space app auth screen oauth

* chore: product update modal logo

* chore: code refactor

* chore: code refactor
This commit is contained in:
Anmol Singh Bhatia
2025-08-01 19:43:14 +05:30
committed by GitHub
parent d41758e73e
commit 96d470dc63
5 changed files with 11 additions and 19 deletions

View File

@@ -198,10 +198,12 @@ export const AuthRoot: FC = observer(() => {
return (
<div className="flex flex-col justify-center items-center flex-grow w-full py-6 mt-10">
<div className="relative flex flex-col gap-6 max-w-[22.5rem] w-full">
<AuthHeader authMode={authMode} />
{errorInfo && errorInfo?.type === EErrorAlertType.BANNER_ALERT && (
<AuthBanner bannerData={errorInfo} handleBannerData={(value) => setErrorInfo(value)} />
)}
<AuthHeader authMode={authMode} />
{isOAuthEnabled && <OAuthOptions options={OAuthConfig} compact={authStep === EAuthSteps.PASSWORD} />}
{authStep === EAuthSteps.EMAIL && <AuthEmailForm defaultEmail={email} onSubmit={handleEmailVerification} />}
{authStep === EAuthSteps.UNIQUE_CODE && (
<AuthUniqueCodeForm
@@ -232,7 +234,6 @@ export const AuthRoot: FC = observer(() => {
}}
/>
)}
{isOAuthEnabled && <OAuthOptions options={OAuthConfig} compact={authStep === EAuthSteps.PASSWORD} />}
<TermsAndConditions isSignUp={authMode === EAuthModes.SIGN_UP ? true : false} />
</div>
</div>

View File

@@ -1,10 +1,8 @@
import { observer } from "mobx-react";
import Image from "next/image";
import { useTranslation } from "@plane/i18n";
import { PlaneLogo } from "@plane/ui";
// helpers
import { cn } from "@plane/utils";
// assets
import PlaneLogo from "@/public/plane-logos/blue-without-text.png";
// package.json
import packageJson from "package.json";
@@ -23,7 +21,7 @@ export const ProductUpdatesHeader = observer(() => {
</div>
</div>
<div className="flex flex-shrink-0 items-center gap-8">
<Image src={PlaneLogo} alt="Plane" width={24} height={24} />
<PlaneLogo className="h-6 w-auto text-custom-text-100" />
</div>
</div>
);

View File

@@ -1,12 +1,9 @@
import Image from "next/image";
import { USER_TRACKER_ELEMENTS } from "@plane/constants";
import { useTranslation } from "@plane/i18n";
// ui
import { getButtonStyling } from "@plane/ui";
import { getButtonStyling, PlaneLogo } from "@plane/ui";
// helpers
import { cn } from "@plane/utils";
// assets
import PlaneLogo from "@/public/plane-logos/blue-without-text.png";
export const ProductUpdatesFooter = () => {
const { t } = useTranslation();
@@ -60,7 +57,7 @@ export const ProductUpdatesFooter = () => {
"flex gap-1.5 items-center text-center font-medium hover:underline underline-offset-2 outline-none"
)}
>
<Image src={PlaneLogo} alt="Plane" width={12} height={12} />
<PlaneLogo className="h-4 w-auto text-custom-text-100" />
{t("powered_by_plane_pages")}
</a>
</div>

View File

@@ -11,7 +11,7 @@ import useSWRImmutable from "swr/immutable";
// ui
import { LogOut } from "lucide-react";
import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
import { Button, getButtonStyling, setToast, TOAST_TYPE, Tooltip } from "@plane/ui";
import { Button, getButtonStyling, PlaneLogo, setToast, TOAST_TYPE, Tooltip } from "@plane/ui";
// components
import { cn } from "@plane/utils";
import { LogoSpinner } from "@/components/common";
@@ -150,7 +150,7 @@ export const WorkspaceAuthWrapper: FC<IWorkspaceAuthWrapper> = observer((props)
<div className="container relative mx-auto flex h-full w-full flex-col overflow-hidden overflow-y-auto px-5 py-14 md:px-0">
<div className="relative flex flex-shrink-0 items-center justify-between gap-4">
<div className="z-10 flex-shrink-0 bg-custom-background-90 py-4">
<Image src={planeLogo} height={26} className="h-[26px]" alt="Plane logo" />
<PlaneLogo className="h-9 w-auto text-custom-text-100" />
</div>
<div className="relative flex items-center gap-2">
<div className="text-sm font-medium">{currentUser?.email}</div>

View File

@@ -1,18 +1,14 @@
import { useState } from "react";
import { observer } from "mobx-react";
import Image from "next/image";
import { ExternalLink, RefreshCw } from "lucide-react";
import { EProductSubscriptionEnum } from "@plane/types";
// plane imports
import { Button, setToast, TOAST_TYPE } from "@plane/ui";
import { Button, setToast, TOAST_TYPE, PlaneLogo } from "@plane/ui";
// helpers
import { cn } from "@plane/utils";
// hooks
import { useInstance } from "@/hooks/store";
// plane web hooks
import { useWorkspaceSubscription } from "@/plane-web/hooks/store";
// assets
import PlaneLogo from "@/public/plane-logos/blue-without-text.png";
// services
import { InstanceService } from "@/services/instance.service";
@@ -93,7 +89,7 @@ export const ProductUpdatesHeader = observer(() => {
Perpetual license
</div>
)}
<Image src={PlaneLogo} alt="Plane" width={24} height={24} />
<PlaneLogo className="h-6 w-auto text-custom-text-100" />
</div>
</div>
);