[WEB-6599] feat: instance not ready ui revamp#8755
[WEB-6599] feat: instance not ready ui revamp#8755anmolsinghbhatia wants to merge 3 commits intopreviewfrom
Conversation
|
Linked to Plane Work Item(s) This comment was auto-generated by Plane |
📝 WalkthroughWalkthroughThe component underwent layout restructuring, replacing theming-based styling with a DefaultLayout wrapper. The sticky header now contains PlaneLockup, while centered content features a new logo and heading. The action button was repositioned inside a link with primary styling, eliminating useTheme dependencies. Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches
🧪 Generate unit tests (beta)
📝 Coding Plan
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment Tip You can customize the tone of the review comments and chat replies.Configure the |
There was a problem hiding this comment.
Pull request overview
Revamps the “instance not ready” screen in the web app to match the updated visual design shown in the PR media, including new branded gradient assets and a simplified layout.
Changes:
- Reworked
InstanceNotReadylayout and styling, replacing the theme-based background pattern with new gradient decorations. - Added new WebP brand assets (logo + background mark) used by the refreshed view.
Reviewed changes
Copilot reviewed 1 out of 3 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| apps/web/core/components/instance/not-ready-view.tsx | Updates the “instance not ready” UI structure, assets, and CTA styling. |
| apps/web/app/assets/auth/gradient-logo.webp | Adds the new gradient logo asset used on the page. |
| apps/web/app/assets/auth/gradient-bg-logo.webp | Adds the gradient background decoration asset used on the page. |
| /** | ||
| * Copyright (c) 2023-present Plane Software, Inc. and contributors | ||
| * SPDX-License-Identifier: AGPL-3.0-only | ||
| * 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"; |
There was a problem hiding this comment.
The file header was changed from the repo-standard AGPL notice to a proprietary/commercial SPDX header. This seems unrelated to the PR’s UI revamp and is inconsistent with other web components (e.g., apps/web/core/components/instance/maintenance-view.tsx). Please revert to the standard project header unless this file is intentionally being relicensed (and, if so, it should be called out explicitly in the PR description).
| import { Button } from "@plane/propel/button"; | ||
|
|
There was a problem hiding this comment.
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.
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@apps/web/core/components/instance/not-ready-view.tsx`:
- Around line 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.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 1787e7be-fd6c-4fb3-9f99-95b230c45991
📒 Files selected for processing (3)
apps/web/app/assets/auth/gradient-bg-logo.webpapps/web/app/assets/auth/gradient-logo.webpapps/web/core/components/instance/not-ready-view.tsx
| 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"; |
There was a problem hiding this comment.
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.
| 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.
Description
This PR includes instance not ready page UI revamp.
Type of Change
Media
Summary by CodeRabbit
Style
Refactor