Skip to content

[WEB-6599] feat: instance not ready ui revamp #8755

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
sriramveeraghanta merged 3 commits into from
Mar 16, 2026
Merged

[WEB-6599] feat: instance not ready ui revamp #8755

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
de4a550
feat: instance not ready ui revamp
anmolsinghbhatia Mar 12, 2026
9406a9c
chore: code refactoring
anmolsinghbhatia Mar 12, 2026
6fb0465
chore: code refactoring
anmolsinghbhatia Mar 12, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added apps/web/app/assets/auth/gradient-bg-logo.webp
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added apps/web/app/assets/auth/gradient-logo.webp
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
76 changes: 37 additions & 39 deletions apps/web/core/components/instance/not-ready-view.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,57 +4,55 @@
* See the LICENSE file for details.
*/

import type { FC } from "react";
import Link from "next/link";
import { useTheme } from "next-themes";
import { GOD_MODE_URL } from "@plane/constants";
import { Button } from "@plane/propel/button";
import { PlaneLockup } from "@plane/propel/icons";
// assets
import PlaneBackgroundPatternDark from "@/app/assets/auth/background-pattern-dark.svg?url";
import PlaneBackgroundPattern from "@/app/assets/auth/background-pattern.svg?url";
import PlaneTakeOffImage from "@/app/assets/plane-takeoff.png?url";
import GradientLogo from "@/app/assets/auth/gradient-logo.webp?url";
import GradientBgLogo from "@/app/assets/auth/gradient-bg-logo.webp?url";
import DefaultLayout from "@/layouts/default-layout";
import { PlaneLockup } from "@plane/propel/icons";
import { Button } from "@plane/propel/button";
Comment on lines 7 to +14

@coderabbitai coderabbitai Bot Mar 12, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

Remove unused Link import.

Link from next/link is imported but never used in this file. The component uses a raw <a> tag for the GOD_MODE_URL navigation (which may be intentional for a full page reload to admin mode).

🧹 Proposed fix 
-import Link from "next/link";
 import { GOD_MODE_URL } from "@plane/constants";
 // assets
 import GradientLogo from "@/app/assets/auth/gradient-logo.webp?url";
 import GradientBgLogo from "@/app/assets/auth/gradient-bg-logo.webp?url";
 import DefaultLayout from "@/layouts/default-layout";
 import { PlaneLockup } from "@plane/propel/icons";
 import { Button } from "@plane/propel/button";
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
import Link from "next/link";
import { useTheme } from "next-themes";
import { GOD_MODE_URL } from "@plane/constants";
import { Button } from "@plane/propel/button";
import { PlaneLockup } from "@plane/propel/icons";
// assets
import PlaneBackgroundPatternDark from "@/app/assets/auth/background-pattern-dark.svg?url";
import PlaneBackgroundPattern from "@/app/assets/auth/background-pattern.svg?url";
import PlaneTakeOffImage from "@/app/assets/plane-takeoff.png?url";
import GradientLogo from "@/app/assets/auth/gradient-logo.webp?url";
import GradientBgLogo from "@/app/assets/auth/gradient-bg-logo.webp?url";
import DefaultLayout from "@/layouts/default-layout";
import { PlaneLockup } from "@plane/propel/icons";
import { Button } from "@plane/propel/button";
import { GOD_MODE_URL } from "@plane/constants";
// assets
import GradientLogo from "@/app/assets/auth/gradient-logo.webp?url";
import GradientBgLogo from "@/app/assets/auth/gradient-bg-logo.webp?url";
import DefaultLayout from "@/layouts/default-layout";
import { PlaneLockup } from "@plane/propel/icons";
import { Button } from "@plane/propel/button";
🤖 Prompt for AI Agents 
Verify each finding against the current code and only fix it if needed.

In `@apps/web/core/components/instance/not-ready-view.tsx` around lines 7 - 14,
Remove the unused Link import: delete the "Link" import from "next/link" since
the component navigates to GOD_MODE_URL via a raw <a> tag (keep the GOD_MODE_URL
reference and existing anchor usage). Ensure no other references to Link remain
in this module (e.g., JSX or helpers) and run a quick lint/TS check to confirm
the unused import is gone.


Comment on lines +14 to 15

Copilot AI Mar 12, 2026

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Link is imported but never used, which will be flagged by the repo’s linting/typecheck. Either remove the unused import, or wrap the PlaneLockup in a <Link href="/">…</Link> (matching AuthHeaderBase) so the logo remains a home navigation link.

Copilot uses AI. Check for mistakes.
export function InstanceNotReady() {
const { resolvedTheme } = useTheme();
const patternBackground = resolvedTheme === "dark" ? PlaneBackgroundPatternDark : PlaneBackgroundPattern;

return (
<div className="relative">
<div className="flex h-screen w-full flex-col overflow-hidden overflow-y-auto">
<div className="z-50 container mx-auto flex h-[110px] flex-shrink-0 items-center justify-between gap-5 px-5 lg:px-0">
<div className="flex items-center gap-x-2 py-10">
<Link href={`/`}>
<PlaneLockup className="h-7 w-auto text-primary" />
</Link>
<DefaultLayout>
<div className="relative z-10 flex h-screen w-screen overflow-hidden">
{/* Background decorations */}
<img
src={GradientBgLogo}
className="pointer-events-none absolute -top-24 -left-32 h-56 w-96 opacity-15"
alt=""
aria-hidden="true"
/>
<img
src={GradientBgLogo}
className="pointer-events-none absolute -right-20 -bottom-16 h-56 w-96 opacity-15"
alt=""
aria-hidden="true"
/>
{/* Main content */}
<div className="flex h-full w-full flex-col items-center px-8 pt-6 pb-10">
<div className="sticky top-0 flex w-full shrink-0 items-center justify-between gap-6">
<PlaneLockup height={20} width={95} className="text-primary" />
</div>
</div>

<div className="absolute inset-0 z-0">
<img src={patternBackground} className="h-full w-full object-cover" alt="Plane background pattern" />
</div>

<div className="relative z-10 mb-[110px] flex-grow">
<div className="relative container mx-auto flex h-full w-full items-center justify-center px-5">
<div className="relative w-auto max-w-2xl space-y-8 py-10">
<div className="relative flex flex-col items-center justify-center space-y-4">
<h1 className="pb-3 text-24 font-bold">Welcome aboard Plane!</h1>
<img src={PlaneTakeOffImage} className="h-full w-full object-cover" alt="Plane Logo" />
<p className="text-14 font-medium text-placeholder">
Get started by setting up your instance and workspace
<div className="flex h-full w-full flex-col items-center justify-center gap-7">
<div className="flex flex-col items-center gap-11">
<img src={GradientLogo} className="h-24 w-40 object-contain" alt="Plane Logo" />
<div className="flex max-w-124 flex-col items-center gap-3">
<h1 className="text-h2-semibold text-primary">Welcome to Plane</h1>
<p className="text-center text-body-md-regular text-secondary">
Set up your instance and create your first workspace to begin managing projects and work.
</p>
</div>
<div>
<a href={GOD_MODE_URL}>
<Button size="xl" className="w-full">
Get started
</Button>
</a>
</div>
</div>
<a href={GOD_MODE_URL} className="w-72">
<Button variant="primary" className="w-full" size="xl">
Get started
</Button>
</a>
</div>
</div>
</div>
</div>
</DefaultLayout>
);
}
Loading