regex101: Props Destructuring (first Pass)

Regular Expression

(export )?const (.* \= \()(.*)(\).*\()(?'fileContent'(\n.*)+)\3\.(?'varName'[^}]*)\}(?'restOfPropLine'.*$)(?'restOfFileContent'(\n.*)+>\n\);)

export const AffiliateAccountBIFields = (props) => (
  <SimpleShowLayout {...props} variant="one">
    <UrlField source="bi_url" options={{ target: '_blank' }} />
    <ProtectedBIConfigField source="bi_settings" />
  </SimpleShowLayout>
);

export const AffiliateAccountGeneralFields = (props) => (
  <SimpleShowLayout {...props}>
    <TextField source="name" />
    <ReferenceField
      linkType="show"
      label="Platform Provider"
      addLabel
      source="platform_provider_id"
      reference="accounts/platform-providers"
      allowEmpty
    >
      <TextField addLabel source="name" />
    </ReferenceField>
    <ReferenceField
      label="Company"
      addLabel
      source="company_id"
      reference="companies"
      linkType="show"
    >
      <TextField addLabel source="name" />
    </ReferenceField>
    <AccountManagerField
      label="Account Manager"
      source="account_manager_id"
      addLabel
    />
    <PortfolioField label="Portfolio" source="portfolio_id" addLabel />
    <FunctionField
      label="Status"
      addLabel
      source="activity_status"
      render={(record) => {
        if (!record.activity_status) return null;
        const humanizedStatus = get(
          ACTIVITY_STATUS_OPTIONS,
          `${record.activity_status}.name`
        );
        if (!humanizedStatus) {
          // eslint-disable-next-line no-console
          console.warn(`Cannot obtain humanized value for activity_status: ${record.activity_status}`);
        }
        return (
          <TextField
            source="activity_status"
            record={{
              ...record,
              activity_status: humanizedStatus || record.activity_status,
            }}
          />
        );
      }}
    />
    <UrlField source="affiliate_system_link" options={{ target: '_blank' }} />
    <CopyToClipboardField source="username">
      <TextField source="username" />
    </CopyToClipboardField>
    <ProtectedField source="password" />
    <CopyToClipboardField source="email">
      <TextField source="email" />
    </CopyToClipboardField>
    <TextField source="security_question" />
    <ProtectedField source="security_answer" />
    <TextField source="type" />
    <BooleanField source="tracking_enabled" />
    <TextField source="tracking_variable_name" />
    <TextField source="external_affiliate_id" />
    <TextField source="revenue_posting_code" />
    <BooleanField source="loss_carry_forward" />
    <DateField source="updated_at" locales="en-GB" showTime />
    <DateField source="created_at" locales="en-GB" showTime />
  </SimpleShowLayout>
);

export const AffiliateAccountTabs = (props) => {
  if (!props.record) {
    return null;
  }

  return (
    <TabbedShowLayout>
      <AffiliateAccountGeneralFields {...props} label="General" />
      <AffiliateAccountBrands {...props} label="Brands" />
      <AffiliateAccountDeals {...props} label="Deals" />
      {props.hasBIPermission && (
        <AffiliateAccountBIFields {...props} label="BI Settings" />
      )}
    </TabbedShowLayout>
  );
};
AffiliateAccountTabs.propTypes = {
  record: PropTypes.object,
  hasBIPermission: PropTypes.bool.isRequired,
};

export const Show = (props) => (
  <AutoLoginStatusDialog messages={messages}>
    <AORShow
      {...props}
      title={(
        <Title
          resource="Affiliate Account"
          type="show"
          buttons={[
            <FavoriteButton
              record={{ _id: props.match.params.id }}
              resource={props.resource}
              style={{ height: '25px' }}
            />,
          ]}
        />
      )}
      actions={(
        <ActionsPanel
          customButtons={[
            <AutoLoginButton
              record={{ _id: props.match.params.id }}
              resource={props.resource}
              resourceConfig={autoLoginConfig}
              label="Auto Login"
            />,
          ]}
        />
      )}
    >
      <AffiliateAccountTabs hasBIPermission={props.hasBIPermission} />
    </AORShow>
    <NotesView isShow match={props.match} resource={props.resource} />
  </AutoLoginStatusDialog>
);
Show.propTypes = {
  match: PropTypes.shape({
    params: PropTypes.shape({
      id: PropTypes.string,
    }),
  }),
  resource: PropTypes.string,
  hasBIPermission: PropTypes.bool.isRequired,
};

export default connect((state) => ({
  hasBIPermission: checkPermission(state.auth.permissions, '*', 'bi_user'),
}))(Show);

Substitution

$1const $2{ ${varName}, ...$3 }$4${fileContent}${varName}}${restOfPropLine}${restOfFileContent}

export const AffiliateAccountBIFields = (props) => (
  <SimpleShowLayout {...props} variant="one">
    <UrlField source="bi_url" options={{ target: '_blank' }} />
    <ProtectedBIConfigField source="bi_settings" />
  </SimpleShowLayout>
);

export const AffiliateAccountGeneralFields = (props) => (
  <SimpleShowLayout {...props}>
    <TextField source="name" />
    <ReferenceField
      linkType="show"
      label="Platform Provider"
      addLabel
      source="platform_provider_id"
      reference="accounts/platform-providers"
      allowEmpty
    >
      <TextField addLabel source="name" />
    </ReferenceField>
    <ReferenceField
      label="Company"
      addLabel
      source="company_id"
      reference="companies"
      linkType="show"
    >
      <TextField addLabel source="name" />
    </ReferenceField>
    <AccountManagerField
      label="Account Manager"
      source="account_manager_id"
      addLabel
    />
    <PortfolioField label="Portfolio" source="portfolio_id" addLabel />
    <FunctionField
      label="Status"
      addLabel
      source="activity_status"
      render={(record) => {
        if (!record.activity_status) return null;
        const humanizedStatus = get(
          ACTIVITY_STATUS_OPTIONS,
          `${record.activity_status}.name`
        );
        if (!humanizedStatus) {
          // eslint-disable-next-line no-console
          console.warn(`Cannot obtain humanized value for activity_status: ${record.activity_status}`);
        }
        return (
          <TextField
            source="activity_status"
            record={{
              ...record,
              activity_status: humanizedStatus || record.activity_status,
            }}
          />
        );
      }}
    />
    <UrlField source="affiliate_system_link" options={{ target: '_blank' }} />
    <CopyToClipboardField source="username">
      <TextField source="username" />
    </CopyToClipboardField>
    <ProtectedField source="password" />
    <CopyToClipboardField source="email">
      <TextField source="email" />
    </CopyToClipboardField>
    <TextField source="security_question" />
    <ProtectedField source="security_answer" />
    <TextField source="type" />
    <BooleanField source="tracking_enabled" />
    <TextField source="tracking_variable_name" />
    <TextField source="external_affiliate_id" />
    <TextField source="revenue_posting_code" />
    <BooleanField source="loss_carry_forward" />
    <DateField source="updated_at" locales="en-GB" showTime />
    <DateField source="created_at" locales="en-GB" showTime />
  </SimpleShowLayout>
);

export const AffiliateAccountTabs = (props) => {
  if (!props.record) {
    return null;
  }

  return (
    <TabbedShowLayout>
      <AffiliateAccountGeneralFields {...props} label="General" />
      <AffiliateAccountBrands {...props} label="Brands" />
      <AffiliateAccountDeals {...props} label="Deals" />
      {props.hasBIPermission && (
        <AffiliateAccountBIFields {...props} label="BI Settings" />
      )}
    </TabbedShowLayout>
  );
};
AffiliateAccountTabs.propTypes = {
  record: PropTypes.object,
  hasBIPermission: PropTypes.bool.isRequired,
};

export const Show = (props) => (
  <AutoLoginStatusDialog messages={messages}>
    <AORShow
      {...props}
      title={(
        <Title
          resource="Affiliate Account"
          type="show"
          buttons={[
            <FavoriteButton
              record={{ _id: props.match.params.id }}
              resource={props.resource}
              style={{ height: '25px' }}
            />,
          ]}
        />
      )}
      actions={(
        <ActionsPanel
          customButtons={[
            <AutoLoginButton
              record={{ _id: props.match.params.id }}
              resource={props.resource}
              resourceConfig={autoLoginConfig}
              label="Auto Login"
            />,
          ]}
        />
      )}
    >
      <AffiliateAccountTabs hasBIPermission={props.hasBIPermission} />
    </AORShow>
    <NotesView isShow match={props.match} resource={props.resource} />
  </AutoLoginStatusDialog>
);
Show.propTypes = {
  match: PropTypes.shape({
    params: PropTypes.shape({
      id: PropTypes.string,
    }),
  }),
  resource: PropTypes.string,
  hasBIPermission: PropTypes.bool.isRequired,
};

export default connect((state) => ({
  hasBIPermission: checkPermission(state.auth.permissions, '*', 'bi_user'),
}))(Show);