Skip to content

Commit

Permalink
refactor: remove unnecessary divs and clean up code without affecting…
Browse files Browse the repository at this point in the history
… layout
  • Loading branch information
dineshsutihar committed Oct 21, 2024
1 parent 917d78e commit 516e714
Showing 1 changed file with 44 additions and 60 deletions.
104 changes: 44 additions & 60 deletions app/(app)/alpha/new/[[...postIdArr]]/_client.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -137,7 +137,7 @@ const Create = () => {
<ChevronUpIcon
className={`${
open ? "rotate-180 transform" : ""
} h-5 w-5 text-neutral-400`}
} h-5 w-5 text-neutral-400`}
/>
</DisclosureButton>
<DisclosurePanel className="pb-2 pt-4">
Expand Down Expand Up @@ -213,67 +213,51 @@ const Create = () => {
<div className="z-60 absolute bottom-0 left-0 right-0 top-0 bg-black opacity-25" />
</div>
)}
<div className="mx-auto w-full max-w-7xl flex-grow text-black lg:flex xl:px-8">
{/* Left sidebar & main wrapper */}
<div className="min-w-0 flex-1 xl:flex">
<div className="lg:min-w-0 lg:flex-1">
<div className="h-full min-h-[40rem] px-4 py-0 sm:px-6 lg:px-4">
{/* Start main area*/}
<div className="relative h-full">
<div className="mx-auto break-words px-2 pb-4 sm:px-4 md:max-w-3xl">
<div className="prose mx-auto max-w-3xl dark:prose-invert lg:prose-lg">
{!body && (
<Controller
name="body"
control={control}
render={({ field }) => (
<Editor {...field} initialValue={"{}"} />
)}
/>
)}
{body && body.length > 0 && (
<Controller
name="body"
control={control}
render={({ field }) => (
<Editor {...field} initialValue={body} />
)}
/>
)}

<div className="flex items-center justify-between">
<>
{saveStatus === "loading" && <p>Auto-saving...</p>}
{saveStatus === "error" && savedTime && (
<p className="text-xs text-red-600 lg:text-sm">
{`Error saving, last saved: ${savedTime.toString()}`}
</p>
)}
{saveStatus === "success" && savedTime && (
<p className="text-xs text-neutral-400 lg:text-sm">
{`Saved: ${savedTime.toString()}`}
</p>
)}
</>
<div />
<div className="mx-auto break-words px-2 pb-4 sm:px-4 md:max-w-3xl">
<div className="prose mx-auto max-w-3xl dark:prose-invert lg:prose-lg">
{!body && (
<Controller
name="body"
control={control}
render={({ field }) => (
<Editor {...field} initialValue={"{}"} />
)}
/>
)}
{body && body.length > 0 && (
<Controller
name="body"
control={control}
render={({ field }) => (
<Editor {...field} initialValue={body} />
)}
/>
)}

<div className="flex">
<button
type="button"
disabled={isDisabled}
className="ml-5 inline-flex justify-center bg-gradient-to-r from-orange-400 to-pink-600 px-4 py-2 text-sm font-medium text-white shadow-sm hover:from-orange-300 hover:to-pink-500 focus:outline-none focus:ring-2 focus:ring-pink-300 focus:ring-offset-2 disabled:opacity-50"
onClick={() => setOpen(true)}
>
{!data?.published && "Publish"}
{data?.published && "Save Changes"}
</button>
</div>
</div>
</div>
</div>
</div>
{/* End main area */}
<div className="flex items-center justify-between">
<div>
{saveStatus === "loading" && (<p className="text-xs lg:text-sm">Auto-saving...</p>)}
{saveStatus === "error" && savedTime && (
<p className="text-xs text-red-600 lg:text-sm">
Error saving, last saved: {savedTime.toString()}
</p>
)}
{saveStatus === "success" && savedTime && (
<p className="text-xs text-neutral-400 lg:text-sm">
Saved: {savedTime.toString()}
</p>
)}
</div>

<button
type="button"
disabled={isDisabled}
className="ml-5 inline-flex justify-center bg-gradient-to-r from-orange-400 to-pink-600 px-4 py-2 text-sm font-medium text-white shadow-sm hover:from-orange-300 hover:to-pink-500 focus:outline-none focus:ring-2 focus:ring-pink-300 focus:ring-offset-2 disabled:opacity-50"
onClick={() => setOpen(true)}
aria-label={data?.published ? "Save changes to document" : "Publish document"}
>
{data?.published ? "Save Changes" : "Publish"}
</button>
</div>
</div>
</div>
Expand Down

0 comments on commit 516e714

Please sign in to comment.