[MOB-1221] dev: updated god mode ui #7879

This commit is contained in:
guru_sainath 2025-10-07 00:24:09 +05:30 committed by GitHub
parent f9e21c58c0
commit 298acb1e91
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 56 additions and 14 deletions

View file

@ -4,6 +4,7 @@ import { FC, useState } from "react";
import { isEmpty } from "lodash-es"; import { isEmpty } from "lodash-es";
import Link from "next/link"; import Link from "next/link";
import { useForm } from "react-hook-form"; import { useForm } from "react-hook-form";
import { Monitor } from "lucide-react";
// plane internal packages // plane internal packages
import { API_BASE_URL } from "@plane/constants"; import { API_BASE_URL } from "@plane/constants";
import { Button, getButtonStyling } from "@plane/propel/button"; import { Button, getButtonStyling } from "@plane/propel/button";
@ -102,7 +103,7 @@ export const InstanceGithubConfigForm: FC<Props> = (props) => {
}, },
]; ];
const GITHUB_SERVICE_FIELD: TCopyField[] = [ const GITHUB_COMMON_SERVICE_DETAILS: TCopyField[] = [
{ {
key: "Origin_URL", key: "Origin_URL",
label: "Origin URL", label: "Origin URL",
@ -122,6 +123,9 @@ export const InstanceGithubConfigForm: FC<Props> = (props) => {
</> </>
), ),
}, },
];
const GITHUB_SERVICE_DETAILS: TCopyField[] = [
{ {
key: "Callback_URI", key: "Callback_URI",
label: "Callback URI", label: "Callback URI",
@ -209,13 +213,30 @@ export const InstanceGithubConfigForm: FC<Props> = (props) => {
</div> </div>
</div> </div>
</div> </div>
<div className="col-span-2 md:col-span-1"> <div className="col-span-2 md:col-span-1 flex flex-col gap-y-6">
<div className="flex flex-col gap-y-4 px-6 pt-1.5 pb-4 bg-custom-background-80/60 rounded-lg">
<div className="pt-2 text-xl font-medium">Plane-provided details for GitHub</div> <div className="pt-2 text-xl font-medium">Plane-provided details for GitHub</div>
{GITHUB_SERVICE_FIELD.map((field) => (
<div className="flex flex-col gap-y-4">
{/* common service details */}
<div className="flex flex-col gap-y-4 px-6 py-4 bg-custom-background-80 rounded-lg">
{GITHUB_COMMON_SERVICE_DETAILS.map((field) => (
<CopyField key={field.key} label={field.label} url={field.url} description={field.description} /> <CopyField key={field.key} label={field.label} url={field.url} description={field.description} />
))} ))}
</div> </div>
{/* web service details */}
<div className="flex flex-col rounded-lg overflow-hidden">
<div className="px-6 py-3 bg-custom-background-80/60 font-medium text-xs uppercase flex items-center gap-x-3 text-custom-text-200">
<Monitor className="w-3 h-3" />
Web
</div>
<div className="px-6 py-4 flex flex-col gap-y-4 bg-custom-background-80">
{GITHUB_SERVICE_DETAILS.map((field) => (
<CopyField key={field.key} label={field.label} url={field.url} description={field.description} />
))}
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

View file

@ -3,6 +3,7 @@ import { FC, useState } from "react";
import { isEmpty } from "lodash-es"; import { isEmpty } from "lodash-es";
import Link from "next/link"; import Link from "next/link";
import { useForm } from "react-hook-form"; import { useForm } from "react-hook-form";
import { Monitor } from "lucide-react";
// plane internal packages // plane internal packages
import { API_BASE_URL } from "@plane/constants"; import { API_BASE_URL } from "@plane/constants";
import { Button, getButtonStyling } from "@plane/propel/button"; import { Button, getButtonStyling } from "@plane/propel/button";
@ -91,7 +92,7 @@ export const InstanceGoogleConfigForm: FC<Props> = (props) => {
}, },
]; ];
const GOOGLE_SERVICE_DETAILS: TCopyField[] = [ const GOOGLE_COMMON_SERVICE_DETAILS: TCopyField[] = [
{ {
key: "Origin_URL", key: "Origin_URL",
label: "Origin URL", label: "Origin URL",
@ -111,6 +112,9 @@ export const InstanceGoogleConfigForm: FC<Props> = (props) => {
</p> </p>
), ),
}, },
];
const GOOGLE_SERVICE_DETAILS: TCopyField[] = [
{ {
key: "Callback_URI", key: "Callback_URI",
label: "Callback URI", label: "Callback URI",
@ -196,9 +200,24 @@ export const InstanceGoogleConfigForm: FC<Props> = (props) => {
</div> </div>
</div> </div>
</div> </div>
<div className="col-span-2 md:col-span-1"> <div className="col-span-2 md:col-span-1 flex flex-col gap-y-6">
<div className="flex flex-col gap-y-4 px-6 pt-1.5 pb-4 bg-custom-background-80/60 rounded-lg">
<div className="pt-2 text-xl font-medium">Plane-provided details for Google</div> <div className="pt-2 text-xl font-medium">Plane-provided details for Google</div>
<div className="flex flex-col gap-y-4">
{/* common service details */}
<div className="flex flex-col gap-y-4 px-6 py-4 bg-custom-background-80 rounded-lg">
{GOOGLE_COMMON_SERVICE_DETAILS.map((field) => (
<CopyField key={field.key} label={field.label} url={field.url} description={field.description} />
))}
</div>
{/* web service details */}
<div className="flex flex-col rounded-lg overflow-hidden">
<div className="px-6 py-3 bg-custom-background-80/60 font-medium text-xs uppercase flex items-center gap-x-3 text-custom-text-200">
<Monitor className="w-3 h-3" />
Web
</div>
<div className="px-6 py-4 flex flex-col gap-y-4 bg-custom-background-80">
{GOOGLE_SERVICE_DETAILS.map((field) => ( {GOOGLE_SERVICE_DETAILS.map((field) => (
<CopyField key={field.key} label={field.label} url={field.url} description={field.description} /> <CopyField key={field.key} label={field.label} url={field.url} description={field.description} />
))} ))}
@ -206,6 +225,8 @@ export const InstanceGoogleConfigForm: FC<Props> = (props) => {
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
</> </>
); );
}; };