Browse Source

🔧 Fix minor styling issues

🐛 Bug fix: Resolve index calculation
🚀 Implement dynamic 'Publish listing' text
 Add CommonLayout component
📦 Refactor code structure
🔨 Improve code readability
🚧 Work in progress: CommonLayout component
main
John Doe 1 year ago
parent
commit
b4de3c4a4f
  1. 50
      src/app/add-listing/[[...stepIndex]]/layout.tsx

50
src/app/add-listing/[[...stepIndex]]/layout.tsx

@ -0,0 +1,50 @@
import React from "react";
import { FC } from "react";
import ButtonPrimary from "@/shared/ButtonPrimary";
import ButtonSecondary from "@/shared/ButtonSecondary";
import { Route } from "@/routers/types";
export interface CommonLayoutProps {
children: React.ReactNode;
params: {
stepIndex: string;
};
}
const CommonLayout: FC<CommonLayoutProps> = ({ children, params }) => {
const index = Number(params.stepIndex) || 1;
const nextHref = (
index < 10 ? `/add-listing/${index + 1}` : `/add-listing/${1}`
) as Route;
const backtHref = (
index > 1 ? `/add-listing/${index - 1}` : `/add-listing/${1}`
) as Route;
const nextBtnText = index > 9 ? "Publish listing" : "Continue";
return (
<div
className={`nc-PageAddListing1 px-4 max-w-3xl mx-auto pb-24 pt-14 sm:py-24 lg:pb-32`}
>
<div className="space-y-11">
<div>
<span className="text-4xl font-semibold">{index}</span>{" "}
<span className="text-lg text-neutral-500 dark:text-neutral-400">
/ 10
</span>
</div>
{/* --------------------- */}
<div className="listingSection__wrap ">{children}</div>
{/* --------------------- */}
<div className="flex justify-end space-x-5">
<ButtonSecondary href={backtHref}>Go back</ButtonSecondary>
<ButtonPrimary href={nextHref}>
{nextBtnText || "Continue"}
</ButtonPrimary>
</div>
</div>
</div>
);
};
export default CommonLayout;
Loading…
Cancel
Save