binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore: format all files in monorepo (#3054)

Browse source 
* chore: format all files in the project

* fix: removing @types/react from dependencies

* fix: adding prettier and eslint config

* chore: format files

* fix: upgrading turbo version

* chore: ignoring warnings and adding todos

* fix: updated the type of bubble menu item in the document editor

* chore: format files

---------

Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com>
This commit is contained in:
sriram veeraghanta 2023-12-10 15:48:10 +05:30
parent e5ae139178
commit 5b0066140f
721 changed files with 3739 additions and 4660 deletions
Download patch file Download diff file Expand all files Collapse all files

6
web/components/instance/ai-form.tsx
View file

@ -57,7 +57,7 @@ export const InstanceAIForm: FC<IInstanceAIForm> = (props) => {
return (
<>
<div className="grid grid-col grid-cols-1 lg:grid-cols-3 items-center justify-between gap-x-16 gap-y-8 w-full">
<div className="grid-col grid w-full grid-cols-1 items-center justify-between gap-x-16 gap-y-8 lg:grid-cols-3">
<div className="flex flex-col gap-1">
<h4 className="text-sm">GPT_ENGINE</h4>
<Controller
@ -73,7 +73,7 @@ export const InstanceAIForm: FC<IInstanceAIForm> = (props) => {
ref={ref}
hasError={Boolean(errors.GPT_ENGINE)}
placeholder="gpt-3.5-turbo"
className="rounded-md font-medium w-full"
className="w-full rounded-md font-medium"
/>
)}
/>
@ -106,7 +106,7 @@ export const InstanceAIForm: FC<IInstanceAIForm> = (props) => {
ref={ref}
hasError={Boolean(errors.OPENAI_API_KEY)}
placeholder="sk-asddassdfasdefqsdfasd23das3dasdcasd"
className="rounded-md font-medium w-full !pr-10"
className="w-full rounded-md !pr-10 font-medium"
/>
)}
/>

22
web/components/instance/email-form.tsx
View file

@ -65,7 +65,7 @@ export const InstanceEmailForm: FC<IInstanceEmailForm> = (props) => {
return (
<>
<div className="grid grid-col grid-cols-1 lg:grid-cols-2 items-center justify-between gap-x-16 gap-y-8 w-full max-w-4xl">
<div className="grid-col grid w-full max-w-4xl grid-cols-1 items-center justify-between gap-x-16 gap-y-8 lg:grid-cols-2">
<div className="flex flex-col gap-1">
<h4 className="text-sm">Host</h4>
<Controller
@ -81,7 +81,7 @@ export const InstanceEmailForm: FC<IInstanceEmailForm> = (props) => {
ref={ref}
hasError={Boolean(errors.EMAIL_HOST)}
placeholder="email.google.com"
className="rounded-md font-medium w-full"
className="w-full rounded-md font-medium"
/>
)}
/>
@ -102,13 +102,13 @@ export const InstanceEmailForm: FC<IInstanceEmailForm> = (props) => {
ref={ref}
hasError={Boolean(errors.EMAIL_PORT)}
placeholder="8080"
className="rounded-md font-medium w-full"
className="w-full rounded-md font-medium"
/>
)}
/>
</div>
</div>
<div className="grid grid-col grid-cols-1 lg:grid-cols-2 items-center justify-between gap-x-16 gap-y-8 w-full max-w-4xl">
<div className="grid-col grid w-full max-w-4xl grid-cols-1 items-center justify-between gap-x-16 gap-y-8 lg:grid-cols-2">
<div className="flex flex-col gap-1">
<h4 className="text-sm">Username</h4>
<Controller
@ -124,7 +124,7 @@ export const InstanceEmailForm: FC<IInstanceEmailForm> = (props) => {
ref={ref}
hasError={Boolean(errors.EMAIL_HOST_USER)}
placeholder="getitdone@projectplane.so"
className="rounded-md font-medium w-full"
className="w-full rounded-md font-medium"
/>
)}
/>
@ -146,7 +146,7 @@ export const InstanceEmailForm: FC<IInstanceEmailForm> = (props) => {
ref={ref}
hasError={Boolean(errors.EMAIL_HOST_PASSWORD)}
placeholder="Password"
className="rounded-md font-medium w-full !pr-10"
className="w-full rounded-md !pr-10 font-medium"
/>
)}
/>
@ -169,13 +169,13 @@ export const InstanceEmailForm: FC<IInstanceEmailForm> = (props) => {
</div>
</div>
<div className="w-full flex flex-col px-1 gap-y-8 max-w-md">
<div className="flex items-center gap-10 pt-4 mr-8">
<div className="flex w-full max-w-md flex-col gap-y-8 px-1">
<div className="mr-8 flex items-center gap-10 pt-4">
<div className="grow">
<div className="text-custom-text-100 font-medium text-sm">
<div className="text-sm font-medium text-custom-text-100">
Turn TLS {Boolean(parseInt(watch("EMAIL_USE_TLS"))) ? "off" : "on"}
</div>
<div className="text-custom-text-300 font-normal text-xs">Use this if your email domain supports TLS.</div>
<div className="text-xs font-normal text-custom-text-300">Use this if your email domain supports TLS.</div>
</div>
<div className="shrink-0">
<Controller
@ -221,7 +221,7 @@ export const InstanceEmailForm: FC<IInstanceEmailForm> = (props) => {
</div> */}
</div>
<div className="flex items-center py-1 max-w-4xl">
<div className="flex max-w-4xl items-center py-1">
<Button variant="primary" onClick={handleSubmit(onSubmit)} loading={isSubmitting}>
{isSubmitting ? "Saving..." : "Save changes"}
</Button>

6
web/components/instance/general-form.tsx
View file

@ -53,7 +53,7 @@ export const InstanceGeneralForm: FC<IInstanceGeneralForm> = (props) => {
return (
<>
<div className="grid grid-col grid-cols-1 md:grid-cols-2 lg:grid-cols-3 items-center justify-between gap-8 w-full">
<div className="grid-col grid w-full grid-cols-1 items-center justify-between gap-8 md:grid-cols-2 lg:grid-cols-3">
<div className="flex flex-col gap-1">
<h4 className="text-sm">Name of instance</h4>
<Controller
@ -69,7 +69,7 @@ export const InstanceGeneralForm: FC<IInstanceGeneralForm> = (props) => {
ref={ref}
hasError={Boolean(errors.instance_name)}
placeholder="Instance Name"
className="rounded-md font-medium w-full"
className="w-full rounded-md font-medium"
/>
)}
/>
@ -95,7 +95,7 @@ export const InstanceGeneralForm: FC<IInstanceGeneralForm> = (props) => {
name="instance_id"
type="text"
value={instance.instance_id}
className="rounded-md font-medium w-full cursor-not-allowed !text-custom-text-400"
className="w-full cursor-not-allowed rounded-md font-medium !text-custom-text-400"
disabled
/>
</div>

10
web/components/instance/github-config-form.tsx
View file

@ -59,7 +59,7 @@ export const InstanceGithubConfigForm: FC<IInstanceGithubConfigForm> = (props) =
return (
<div className="flex flex-col gap-8">
<div className="grid grid-col grid-cols-1 lg:grid-cols-3 justify-between gap-x-12 gap-y-8 w-full">
<div className="grid-col grid w-full grid-cols-1 justify-between gap-x-12 gap-y-8 lg:grid-cols-3">
<div className="flex flex-col gap-1">
<h4 className="text-sm">Client ID</h4>
<Controller
@ -75,7 +75,7 @@ export const InstanceGithubConfigForm: FC<IInstanceGithubConfigForm> = (props) =
ref={ref}
hasError={Boolean(errors.GITHUB_CLIENT_ID)}
placeholder="70a44354520df8bd9bcd"
className="rounded-md font-medium w-full"
className="w-full rounded-md font-medium"
/>
)}
/>
@ -107,7 +107,7 @@ export const InstanceGithubConfigForm: FC<IInstanceGithubConfigForm> = (props) =
ref={ref}
hasError={Boolean(errors.GITHUB_CLIENT_SECRET)}
placeholder="9b0050f94ec1b744e32ce79ea4ffacd40d4119cb"
className="rounded-md font-medium w-full !pr-10"
className="w-full rounded-md !pr-10 font-medium"
/>
)}
/>
@ -144,7 +144,7 @@ export const InstanceGithubConfigForm: FC<IInstanceGithubConfigForm> = (props) =
<h4 className="text-sm">Origin URL</h4>
<Button
variant="neutral-primary"
className="py-2 flex justify-between items-center"
className="flex items-center justify-between py-2"
onClick={() => {
navigator.clipboard.writeText(originURL);
setToastAlert({
@ -154,7 +154,7 @@ export const InstanceGithubConfigForm: FC<IInstanceGithubConfigForm> = (props) =
});
}}
>
<p className="font-medium text-sm">{originURL}</p>
<p className="text-sm font-medium">{originURL}</p>
<Copy size={18} color="#B9B9B9" />
</Button>
<p className="text-xs text-custom-text-400">

8
web/components/instance/google-config-form.tsx
View file

@ -57,7 +57,7 @@ export const InstanceGoogleConfigForm: FC<IInstanceGoogleConfigForm> = (props) =
return (
<div className="flex flex-col gap-8">
<div className="grid grid-col grid-cols-1 lg:grid-cols-3 justify-between gap-x-12 gap-y-8 w-full">
<div className="grid-col grid w-full grid-cols-1 justify-between gap-x-12 gap-y-8 lg:grid-cols-3">
<div className="flex flex-col gap-1">
<h4 className="text-sm">Client ID</h4>
<Controller
@ -73,7 +73,7 @@ export const InstanceGoogleConfigForm: FC<IInstanceGoogleConfigForm> = (props) =
ref={ref}
hasError={Boolean(errors.GOOGLE_CLIENT_ID)}
placeholder="840195096245-0p2tstej9j5nc4l8o1ah2dqondscqc1g.apps.googleusercontent.com"
className="rounded-md font-medium w-full"
className="w-full rounded-md font-medium"
/>
)}
/>
@ -93,7 +93,7 @@ export const InstanceGoogleConfigForm: FC<IInstanceGoogleConfigForm> = (props) =
<h4 className="text-sm">JavaScript origin URL</h4>
<Button
variant="neutral-primary"
className="py-2 flex justify-between items-center"
className="flex items-center justify-between py-2"
onClick={() => {
navigator.clipboard.writeText(originURL);
setToastAlert({
@ -103,7 +103,7 @@ export const InstanceGoogleConfigForm: FC<IInstanceGoogleConfigForm> = (props) =
});
}}
>
<p className="font-medium text-sm">{originURL}</p>
<p className="text-sm font-medium">{originURL}</p>
<Copy size={18} color="#B9B9B9" />
</Button>
<p className="text-xs text-custom-text-400">

22
web/components/instance/help-section.tsx
View file

@ -45,14 +45,14 @@ export const InstanceHelpSection: FC = () => {
return (
<div
className={`flex w-full items-center justify-between gap-1 self-baseline border-t border-custom-border-200 bg-custom-sidebar-background-100 py-2 px-4 ${
className={`flex w-full items-center justify-between gap-1 self-baseline border-t border-custom-border-200 bg-custom-sidebar-background-100 px-4 py-2 ${
sidebarCollapsed ? "flex-col" : ""
}`}
>
<div className={`flex items-center gap-1 ${sidebarCollapsed ? "flex-col justify-center" : "justify-end w-full"}`}>
<div className={`flex items-center gap-1 ${sidebarCollapsed ? "flex-col justify-center" : "w-full justify-end"}`}>
<button
type="button"
className={`grid place-items-center rounded-md p-1.5 text-custom-text-200 hover:text-custom-text-100 hover:bg-custom-background-90 outline-none ${
className={`grid place-items-center rounded-md p-1.5 text-custom-text-200 outline-none hover:bg-custom-background-90 hover:text-custom-text-100 ${
sidebarCollapsed ? "w-full" : ""
}`}
onClick={() => setIsNeedHelpOpen((prev) => !prev)}
@ -61,14 +61,14 @@ export const InstanceHelpSection: FC = () => {
</button>
<button
type="button"
className="grid place-items-center rounded-md p-1.5 text-custom-text-200 hover:text-custom-text-100 hover:bg-custom-background-90 outline-none md:hidden"
className="grid place-items-center rounded-md p-1.5 text-custom-text-200 outline-none hover:bg-custom-background-90 hover:text-custom-text-100 md:hidden"
onClick={() => toggleSidebar()}
>
<MoveLeft className="h-3.5 w-3.5" />
</button>
<button
type="button"
className={`hidden md:grid place-items-center rounded-md p-1.5 text-custom-text-200 hover:text-custom-text-100 hover:bg-custom-background-90 outline-none ${
className={`hidden place-items-center rounded-md p-1.5 text-custom-text-200 outline-none hover:bg-custom-background-90 hover:text-custom-text-100 md:grid ${
sidebarCollapsed ? "w-full" : ""
}`}
onClick={() => toggleSidebar()}
@ -90,7 +90,7 @@ export const InstanceHelpSection: FC = () => {
<div
className={`absolute bottom-2 min-w-[10rem] ${
sidebarCollapsed ? "left-full" : "-left-[75px]"
} rounded bg-custom-background-100 p-1 shadow-custom-shadow-xs whitespace-nowrap divide-y divide-custom-border-200`}
} divide-y divide-custom-border-200 whitespace-nowrap rounded bg-custom-background-100 p-1 shadow-custom-shadow-xs`}
ref={helpOptionsRef}
>
<div className="space-y-1 pb-2">
@ -99,8 +99,8 @@ export const InstanceHelpSection: FC = () => {
return (
<Link href={href} key={name} target="_blank">
<div className="flex items-center gap-x-2 rounded px-2 py-1 text-xs hover:bg-custom-background-80">
<div className="grid place-items-center flex-shrink-0">
<Icon className="text-custom-text-200 h-3.5 w-3.5" size={14} />
<div className="grid flex-shrink-0 place-items-center">
<Icon className="h-3.5 w-3.5 text-custom-text-200" size={14} />
</div>
<span className="text-xs">{name}</span>
</div>
@ -114,15 +114,15 @@ export const InstanceHelpSection: FC = () => {
onClick={onClick ?? undefined}
className="flex w-full items-center gap-x-2 rounded px-2 py-1 text-xs hover:bg-custom-background-80"
>
<div className="grid place-items-center flex-shrink-0">
<Icon className="text-custom-text-200 h-3.5 w-3.5" />
<div className="grid flex-shrink-0 place-items-center">
<Icon className="h-3.5 w-3.5 text-custom-text-200" />
</div>
<span className="text-xs">{name}</span>
</button>
);
})}
</div>
<div className="px-2 pt-2 pb-1 text-[10px]">Version: v{packageJson.version}</div>
<div className="px-2 pb-1 pt-2 text-[10px]">Version: v{packageJson.version}</div>
</div>
</Transition>
</div>

6
web/components/instance/image-config-form.tsx
View file

@ -55,8 +55,8 @@ export const InstanceImageConfigForm: FC<IInstanceImageConfigForm> = (props) =>
return (
<>
<div className="grid grid-col grid-cols-1 lg:grid-cols-2 items-center justify-between gap-x-16 gap-y-8 w-full">
<div className="flex flex-col gap-1 max-w-md">
<div className="grid-col grid w-full grid-cols-1 items-center justify-between gap-x-16 gap-y-8 lg:grid-cols-2">
<div className="flex max-w-md flex-col gap-1">
<h4 className="text-sm">Access key from your Unsplash account</h4>
<div className="relative">
<Controller
@ -72,7 +72,7 @@ export const InstanceImageConfigForm: FC<IInstanceImageConfigForm> = (props) =>
ref={ref}
hasError={Boolean(errors.UNSPLASH_ACCESS_KEY)}
placeholder="oXgq-sdfadsaeweqasdfasdf3234234rassd"
className="rounded-md font-medium w-full !pr-10"
className="w-full rounded-md !pr-10 font-medium"
/>
)}
/>

30
web/components/instance/instance-admin-restriction.tsx
View file

@ -13,7 +13,7 @@ interface InstanceAdminRestrictionProps {
}
export const InstanceAdminRestriction: FC<InstanceAdminRestrictionProps> = ({ redirectWorkspaceSlug }) => (
<div className={`my-8 w-full flex flex-col gap-4 items-center justify-center overflow-hidden`}>
<div className={`my-8 flex w-full flex-col items-center justify-center gap-4 overflow-hidden`}>
<div className="w-3/5 bg-custom-background-90">
<div className="grid h-full place-items-center p-2 pb-0">
<div className="text-center">
@ -21,41 +21,41 @@ export const InstanceAdminRestriction: FC<InstanceAdminRestrictionProps> = ({ re
<h3 className="text-3xl font-semibold">God mode needs a god role</h3>
<p className="text-base text-custom-text-300">Doesn’t look like you have that role.</p>
</div>
<div className="flex flex-col gap-2 my-8 text-center">
<div className="my-8 flex flex-col gap-2 text-center">
<div>
<p className="font-medium text-xs text-custom-text-400 tracking-tight">Do we have a god role?</p>
<p className="text-custom-text-300 text-sm">Yes.</p>
<p className="text-xs font-medium tracking-tight text-custom-text-400">Do we have a god role?</p>
<p className="text-sm text-custom-text-300">Yes.</p>
</div>
<div>
<p className="font-medium text-xs text-custom-text-400 tracking-tight">Do we call it god role?</p>
<p className="text-custom-text-300 text-sm">No. Obviously not.</p>
<p className="text-xs font-medium tracking-tight text-custom-text-400">Do we call it god role?</p>
<p className="text-sm text-custom-text-300">No. Obviously not.</p>
</div>
<div>
<p className="font-medium text-xs text-custom-text-400 tracking-tight">Can you get it?</p>
<p className="text-custom-text-300 text-sm">Maybe. Ask your god.</p>
<p className="text-xs font-medium tracking-tight text-custom-text-400">Can you get it?</p>
<p className="text-sm text-custom-text-300">Maybe. Ask your god.</p>
</div>
<div>
<p className="font-medium text-xs text-custom-text-400 tracking-tight">
<p className="text-xs font-medium tracking-tight text-custom-text-400">
Are we being intentionally cryptic?
</p>
<p className="text-custom-text-300 text-sm">Yes.</p>
<p className="text-sm text-custom-text-300">Yes.</p>
</div>
<div>
<p className="font-medium text-xs text-custom-text-400 tracking-tight">
<p className="text-xs font-medium tracking-tight text-custom-text-400">
Is this for the security of your workspaces?
</p>
<p className="text-custom-text-300 text-sm">Absolutely!</p>
<p className="text-sm text-custom-text-300">Absolutely!</p>
</div>
<div>
<p className="font-medium text-xs text-custom-text-400 tracking-tight">
<p className="text-xs font-medium tracking-tight text-custom-text-400">
Are you the god here and still seeing this?
</p>
<p className="text-custom-text-300 text-sm">
<p className="text-sm text-custom-text-300">
Sorry, God.{" "}
<a
href="https://discord.com/channels/1031547764020084846/1094927053867995176"
target="_blank"
className="text-custom-primary-100 font-medium hover:underline"
className="font-medium text-custom-primary-100 hover:underline"
rel="noreferrer"
>
Talk to us.

8
web/components/instance/not-ready-view.tsx
View file

@ -14,15 +14,15 @@ export const InstanceNotReady = () => {
return (
<div className="h-screen w-full overflow-y-auto bg-onboarding-gradient-100">
<div className="h-full w-full pt-24">
<div className="h-full bg-onboarding-gradient-100 md:w-2/3 sm:w-4/5 px-4 pt-4 rounded-t-md mx-auto shadow-sm border-x border-t border-custom-border-100">
<div className="relative px-7 sm:px-0 bg-onboarding-gradient-200 h-full rounded-t-md">
<div className="flex items-center py-10 justify-center">
<div className="mx-auto h-full rounded-t-md border-x border-t border-custom-border-100 bg-onboarding-gradient-100 px-4 pt-4 shadow-sm sm:w-4/5 md:w-2/3">
<div className="relative h-full rounded-t-md bg-onboarding-gradient-200 px-7 sm:px-0">
<div className="flex items-center justify-center py-10">
<Image src={planeLogo} className="h-[44px] w-full" alt="Plane logo" />
</div>
<div className="mt-20">
<Image src={instanceNotReady} className="w-full" alt="Instance not ready" />
</div>
<div className="flex flex-col gap-5 items-center py-12 pb-20 w-full">
<div className="flex w-full flex-col items-center gap-5 py-12 pb-20">
<h3 className="text-2xl font-medium">Your Plane instance isn{"'"}t ready yet</h3>
<p className="text-sm">Ask your Instance Admin to complete set-up first.</p>
</div>

14
web/components/instance/setup-done-view.tsx
View file

@ -30,23 +30,23 @@ export const InstanceSetupDone = () => {
return (
<div className="h-full w-full overflow-hidden">
<div className="bg-onboarding-gradient-100 h-full w-full pt-12 overflow-hidden">
<div className="h-full bg-onboarding-gradient-100 md:w-2/3 sm:w-4/5 px-4 pt-4 rounded-t-md mx-auto shadow-sm border-x border-t border-custom-border-200 overflow-hidden">
<div className="flex flex-col items-center relative px-7 sm:px-0 bg-onboarding-gradient-200 h-full rounded-t-md overflow-y-auto pb-8">
<div className="flex py-10 justify-center">
<div className="h-full w-full overflow-hidden bg-onboarding-gradient-100 pt-12">
<div className="mx-auto h-full overflow-hidden rounded-t-md border-x border-t border-custom-border-200 bg-onboarding-gradient-100 px-4 pt-4 shadow-sm sm:w-4/5 md:w-2/3">
<div className="relative flex h-full flex-col items-center overflow-y-auto rounded-t-md bg-onboarding-gradient-200 px-7 pb-8 sm:px-0">
<div className="flex justify-center py-10">
<div className="h-[30px]">
<Image src={planeLogo} className="h-full w-full" alt="Plane logo" />
</div>
</div>
<div className="grid place-items-center my-8">
<div className="my-8 grid place-items-center">
<div className="w-[444px]">
<Image src={instanceSetupDone} className="h-full w-full" alt="image" />
</div>
</div>
<div className="flex flex-col gap-8 items-center w-full sm:px-4">
<div className="bg-purple-500/20 border border-purple-500 py-2.5 px-3 rounded text-center space-y-3">
<div className="flex w-full flex-col items-center gap-8 sm:px-4">
<div className="space-y-3 rounded border border-purple-500 bg-purple-500/20 px-3 py-2.5 text-center">
<h6 className="text-base font-semibold">
Your instance is now ready for more security, more controls, and more intelligence.
</h6>

4
web/components/instance/setup-form/root.tsx
View file

@ -16,8 +16,8 @@ export const InstanceSetupFormRoot = () => {
<>
{setupStep === EInstanceSetupSteps.DONE && <InstanceSetupDone />}
{setupStep === EInstanceSetupSteps.SIGN_IN && (
<div className="h-full bg-onboarding-gradient-100 md:w-2/3 sm:w-4/5 px-4 pt-4 rounded-t-md mx-auto shadow-sm border-x border-t border-custom-border-200">
<div className="bg-onboarding-gradient-200 h-full pt-24 pb-56 rounded-t-md overflow-auto">
<div className="mx-auto h-full rounded-t-md border-x border-t border-custom-border-200 bg-onboarding-gradient-100 px-4 pt-4 shadow-sm sm:w-4/5 md:w-2/3">
<div className="h-full overflow-auto rounded-t-md bg-onboarding-gradient-200 pb-56 pt-24">
<div className="mx-auto flex flex-col">
<InstanceSetupSignInForm handleNextStep={() => setSetupStep(EInstanceSetupSteps.DONE)} />
</div>

16
web/components/instance/setup-form/sign-in-form.tsx
View file

@ -66,15 +66,15 @@ export const InstanceSetupSignInForm: FC<IInstanceSetupEmailForm> = (props) => {
return (
<form onSubmit={handleSubmit(handleFormSubmit)}>
<h1 className="text-center text-2xl sm:text-2.5xl font-medium text-onboarding-text-100">
<h1 className="sm:text-2.5xl text-center text-2xl font-medium text-onboarding-text-100">
Let{"'"}s secure your instance
</h1>
<p className="text-center text-sm text-onboarding-text-200 mt-3">
<p className="mt-3 text-center text-sm text-onboarding-text-200">
Explore privacy options. Get AI features. Secure access.
<br />
Takes 2 minutes.
</p>
<div className="relative mt-5 w-full sm:w-96 mx-auto space-y-4">
<div className="relative mx-auto mt-5 w-full space-y-4 sm:w-96">
<Controller
name="email"
control={control}
@ -83,7 +83,7 @@ export const InstanceSetupSignInForm: FC<IInstanceSetupEmailForm> = (props) => {
validate: (value) => checkEmailValidity(value) || "Email is invalid",
}}
render={({ field: { value, onChange } }) => (
<div className="flex items-center relative rounded-md bg-onboarding-background-200">
<div className="relative flex items-center rounded-md bg-onboarding-background-200">
<Input
id="email"
name="email"
@ -91,11 +91,11 @@ export const InstanceSetupSignInForm: FC<IInstanceSetupEmailForm> = (props) => {
value={value}
onChange={onChange}
placeholder="orville.wright@firstflight.com"
className="w-full h-[46px] placeholder:text-onboarding-text-400 border border-onboarding-border-100 pr-12"
className="h-[46px] w-full border border-onboarding-border-100 pr-12 placeholder:text-onboarding-text-400"
/>
{value.length > 0 && (
<XCircle
className="h-5 w-5 absolute stroke-custom-text-400 hover:cursor-pointer right-3"
className="absolute right-3 h-5 w-5 stroke-custom-text-400 hover:cursor-pointer"
onClick={() => setValue("email", "")}
/>
)}
@ -115,11 +115,11 @@ export const InstanceSetupSignInForm: FC<IInstanceSetupEmailForm> = (props) => {
onChange={onChange}
hasError={Boolean(errors.password)}
placeholder="Enter password"
className="w-full h-[46px] placeholder:text-onboarding-text-400 border border-onboarding-border-100 pr-12 !bg-onboarding-background-200"
className="h-[46px] w-full border border-onboarding-border-100 !bg-onboarding-background-200 pr-12 placeholder:text-onboarding-text-400"
/>
)}
/>
<p className="text-xs text-custom-text-200 pb-2">
<p className="pb-2 text-xs text-custom-text-200">
Use your email address if you are the instance admin. <br /> Use your admin’s e-mail if you are not.
</p>
<Button variant="primary" className="w-full" size="xl" type="submit" loading={isSubmitting}>

8
web/components/instance/setup-view.tsx
View file

@ -24,11 +24,11 @@ export const InstanceSetupView = observer(() => {
return (
<>
<div className="bg-onboarding-gradient-100 h-full w-full flex flex-col">
<div className="flex items-center justify-between sm:py-5 px-8 pb-4 sm:px-16 lg:px-28 ">
<div className="flex gap-x-2 py-10 items-center">
<div className="flex h-full w-full flex-col bg-onboarding-gradient-100">
<div className="flex items-center justify-between px-8 pb-4 sm:px-16 sm:py-5 lg:px-28 ">
<div className="flex items-center gap-x-2 py-10">
<Image src={BluePlaneLogoWithoutText} height={30} width={30} alt="Plane Logo" className="mr-2" />
<span className="font-semibold text-2xl sm:text-3xl">Plane</span>
<span className="text-2xl font-semibold sm:text-3xl">Plane</span>
</div>
</div>
<InstanceSetupFormRoot />

18
web/components/instance/sidebar-dropdown.tsx
View file

@ -61,25 +61,25 @@ export const InstanceSidebarDropdown = observer(() => {
};
return (
<div className="flex items-center gap-x-5 gap-y-2 px-4 py-3.5 max-h-[3.75rem] border-b border-custom-sidebar-border-200">
<div className="w-full h-full truncate">
<div className="flex max-h-[3.75rem] items-center gap-x-5 gap-y-2 border-b border-custom-sidebar-border-200 px-4 py-3.5">
<div className="h-full w-full truncate">
<div
className={`flex flex-grow items-center gap-x-2 rounded py-1 truncate ${
className={`flex flex-grow items-center gap-x-2 truncate rounded py-1 ${
sidebarCollapsed ? "justify-center" : ""
}`}
>
<div className="flex-shrink-0 flex items-center justify-center h-7 w-7 rounded bg-custom-sidebar-background-80">
<div className="flex h-7 w-7 flex-shrink-0 items-center justify-center rounded bg-custom-sidebar-background-80">
<UserCog2 className="h-5 w-5 text-custom-text-200" />
</div>
{!sidebarCollapsed && (
<div className="flex w-full gap-2">
<h4 className="grow text-custom-text-200 font-medium text-base truncate">Instance admin</h4>
<h4 className="grow truncate text-base font-medium text-custom-text-200">Instance admin</h4>
<Tooltip position="bottom-left" tooltipContent="Exit God Mode">
<div className="flex-shrink-0">
<Link href={`/${redirectWorkspaceSlug}`}>
<span>
<LogIn className="h-5 w-5 text-custom-text-200 rotate-180" />
<LogIn className="h-5 w-5 rotate-180 text-custom-text-200" />
</span>
</Link>
</div>
@ -111,8 +111,8 @@ export const InstanceSidebarDropdown = observer(() => {
leaveTo="transform opacity-0 scale-95"
>
<Menu.Items
className="absolute left-0 z-20 mt-1.5 flex flex-col w-52 rounded-md
border border-custom-sidebar-border-200 bg-custom-sidebar-background-100 px-1 py-2 divide-y divide-custom-sidebar-border-100 shadow-lg text-xs outline-none"
className="absolute left-0 z-20 mt-1.5 flex w-52 flex-col divide-y
divide-custom-sidebar-border-100 rounded-md border border-custom-sidebar-border-200 bg-custom-sidebar-background-100 px-1 py-2 text-xs shadow-lg outline-none"
>
<div className="flex flex-col gap-2.5 pb-2">
<span className="px-2 text-custom-sidebar-text-200">{currentUser?.email}</span>
@ -142,7 +142,7 @@ export const InstanceSidebarDropdown = observer(() => {
<div className="p-2 pb-0">
<Menu.Item as="button" type="button" className="w-full">
<Link href={`/${redirectWorkspaceSlug}`}>
<span className="flex w-full items-center justify-center rounded px-2 py-1 text-sm font-medium text-custom-primary-100 hover:text-custom-primary-200 bg-custom-primary-100/20 hover:bg-custom-primary-100/30">
<span className="flex w-full items-center justify-center rounded bg-custom-primary-100/20 px-2 py-1 text-sm font-medium text-custom-primary-100 hover:bg-custom-primary-100/30 hover:text-custom-primary-200">
Exit God Mode
</span>
</Link>

2
web/components/instance/sidebar-menu.tsx
View file

@ -48,7 +48,7 @@ export const InstanceAdminSidebarMenu = () => {
const router = useRouter();
return (
<div className="flex flex-col gap-2.5 py-6 px-4 h-full w-full overflow-y-auto">
<div className="flex h-full w-full flex-col gap-2.5 overflow-y-auto px-4 py-6">
{INSTANCE_ADMIN_LINKS.map((item, index) => {
const isActive = item.name === "Settings" ? router.asPath.includes(item.href) : router.asPath === item.href;