feat(PartnerInfoModal): displaying firstName and lastName inputs when…

packages/mint-components/.changeset/puny-brooms-call.md

@@ -0,0 +1,5 @@
+---
+"@saasquatch/mint-components": minor
+---
+
+Partner info modal now shows firstName and lastName inputs when either is missing from the user

packages/mint-components/src/components/sqm-partner-info-modal/PartnerInfoModal.stories.tsx

@@ -27,6 +27,8 @@ const demoCurrencies = [
 ];
 
 const noopCallbacks = {
+  onFirstNameChange: (e: any) => console.log("First name changed:", e),
+  onLastNameChange: (e: any) => console.log("Last name changed:", e),
   onCountryChange: (e: any) => console.log("Country changed:", e),
   onCurrencyChange: (e: any) => console.log("Currency changed:", e),
   onCheckboxChange: (e: any) => console.log("Checkbox changed:", e),
@@ -66,6 +68,9 @@ const defaultProps: PartnerInfoModalViewProps = {
     loading: false,
     submitting: false,
     isExistingPartner: false,
+    shouldDisplayNameFields: false,
+    firstName: "",
+    lastName: "",
     countryCode: "",
     currency: "",
     error: "",
@@ -208,3 +213,39 @@ export const SQMComponentNewPartner = () => {
     ></sqm-partner-info-modal>
   );
 };
+
+export const PartnerHasFirstAndLastName = () => {
+  const props: PartnerInfoModalViewProps = {
+    ...defaultProps,
+    states: {
+      ...defaultProps.states,
+      firstName: "John",
+      lastName: "Doe",
+    },
+  };
+  return <PartnerInfoModalView {...props} />;
+};
+
+export const PartnerHasFirstNameOnly = () => {
+  const props: PartnerInfoModalViewProps = {
+    ...defaultProps,
+    states: {
+      ...defaultProps.states,
+      firstName: "John",
+      lastName: "",
+      shouldDisplayNameFields: true,
+    },
+  };
+  return <PartnerInfoModalView {...props} />;
+};
+
+export const Loading = () => {
+  const props: PartnerInfoModalViewProps = {
+    ...defaultProps,
+    states: {
+      ...defaultProps.states,
+      loading: true,
+    },
+  };
+  return <PartnerInfoModalView {...props} />;
+};