Next.js Discord

Discord Forum

I want to make my parallel route dynamic? can i do that?

Unanswered
Dutch Smoushond posted this in #help-forum
Open in Discord
Dutch SmoushondOP
@[parallelRoute]

4 Replies

@Dutch Smoushond @[parallelRoute]
no, not possible.

any reason you want to do this?
Dutch SmoushondOP
just exploring the framework

/[service]
/[sid]
/[...id] (here i put condition to check parameter count and display the respective details accordingly)
/@adya
/[h]
/@honey
/@parallelp


1. i want to conditionally open the parallel route
but when i put parallel route in page.tsx of [...id] it is not working
with layout it is working but button get attached to every route that comes under [...id]

2. right now the parallel routes are static , i want to render dynamic data in there how to do that?



in layout code i put conditions to display the parallel routes like this
'use client';
import { ReactNode, useState } from 'react';

export default function Id({
children,
honey,
parallelp,
adya,
}: {
children: ReactNode;
honey: ReactNode;
parallelp: ReactNode;
adya: ReactNode;
}) {
const [showContent, setShowContent] = useState(false);

const handleClick = () => {
setShowContent(true);
};

return (
<div className="flex h-screen">
<div className={p-4 bg-red-100 transition-all duration-500 ${showContent ? 'w-1/2' : 'w-full'}}>
<div>{children}</div>
<button
className="px-4 py-2 bg-blue-700 text-white rounded-md shadow-md hover:bg-blue-600 mb-4"
onClick={handleClick}
>
CLICK
</button>
</div>
{showContent && (
<div className="w-1/2 p-4 border-l border-gray-300 transition-all duration-500">
<div className="mt-4">
<div>{honey}</div>
<div>{adya}</div>
<div>{parallelp}</div>

</div>
</div>
)}
</div>
);
}
sorry. i still have no idea what you are trying to achieve and what you are trying to do here.
Dutch SmoushondOP
i want to render 2 different page
example like working on google docs on the left and google excel on the right