Refactor ProposalBuilder and StepButtons to Use React Node for Enhanc…

…ed Flexibility

- Updated the ProposalBuilder component to replace JSX.Element with React.ReactNode for props including actionsExperience, stepButtons, transactionsDetails, templateDetails, and streamsDetails, allowing for greater flexibility in rendering.
- Modified the StepButtons component to change metadataStepButtons and transactionsStepButtons props from JSX.Element to React.ReactNode, improving consistency in button rendering.
- These changes aim to enhance the modularity and clarity of the proposal creation process, facilitating easier future enhancements.

src/components/ProposalBuilder/ProposalBuilder.tsx

@@ -65,26 +65,26 @@ interface ProposalBuilderProps {
   pageHeaderBreadcrumbs: Crumb[];
   pageHeaderButtonClickHandler: () => void;
   proposalMetadataTypeProps: ProposalMetadataTypeProps;
-  actionsExperience: JSX.Element | null;
+  actionsExperience: React.ReactNode | null;
   stepButtons: ({
     formErrors,
     createProposalBlocked,
   }: {
     formErrors: boolean;
     createProposalBlocked: boolean;
-  }) => JSX.Element;
+  }) => React.ReactNode;
   transactionsDetails:
-    | ((transactions: CreateProposalTransaction<BigIntValuePair>[]) => JSX.Element)
+    | ((transactions: CreateProposalTransaction<BigIntValuePair>[]) => React.ReactNode)
     | null;
-  templateDetails: ((title: string) => JSX.Element) | null;
-  streamsDetails: ((streams: Stream[]) => JSX.Element) | null;
+  templateDetails: ((title: string) => React.ReactNode) | null;
+  streamsDetails: ((streams: Stream[]) => React.ReactNode) | null;
   prepareProposalData: (values: CreateProposalForm) => Promise<ProposalExecuteData | undefined>;
   initialValues: CreateProposalForm;
   contentRoute: (
     formikProps: FormikProps<CreateProposalForm>,
     pendingCreateTx: boolean,
     nonce: number | undefined,
-  ) => JSX.Element;
+  ) => React.ReactNode;
 }
 
 export function ProposalBuilder({

src/components/ProposalBuilder/StepButtons.tsx

@@ -6,8 +6,8 @@ import { useDaoInfoStore } from '../../store/daoInfo/useDaoInfoStore';
 import { CreateProposalSteps } from '../../types';
 
 interface StepButtonsProps {
-  metadataStepButtons: JSX.Element;
-  transactionsStepButtons: JSX.Element;
+  metadataStepButtons: React.ReactNode;
+  transactionsStepButtons: React.ReactNode;
 }
 
 export function PreviousButton({ prevStepUrl }: { prevStepUrl: string }) {