Skip to content

fix(app-degree-pages): refactor defaultProps to use JS default params #1596

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: dev
Choose a base branch
from
+71 −195
Open

fix(app-degree-pages): refactor defaultProps to use JS default params #1596

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
d6ac389
fix(app-degree-pages): refactor defaultProps to use JS default params
oatkar Oct 23, 2025
59fdf07
Update packages/app-rfi/src/components/controls/RfiTextArea.js
davidornelas11 Nov 5, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 18 additions & 40 deletions packages/app-rfi/src/components/AsuRfi/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,24 +29,24 @@ const currentScriptPath = getCurrentScriptPath();
const AsuRfi = props => {
const {
appPathFolder,
variant,
campus,
actualCampus,
college,
department,
studentType,
areaOfInterest,
areaOfInterestOptional,
programOfInterest,
programOfInterestOptional,
isCertMinor,
country,
stateProvince,
successMsg,
test,
dataSourceDegreeSearch,
dataSourceAsuOnline,
dataSourceCountriesStates,
variant = undefined,
campus = undefined,
actualCampus = undefined,
college = undefined,
department = undefined,
studentType = undefined,
areaOfInterest = undefined,
areaOfInterestOptional = false,
programOfInterest = undefined,
programOfInterestOptional = false,
isCertMinor = false,
country = undefined,
stateProvince = undefined,
successMsg = undefined,
test = false,
dataSourceDegreeSearch = DATA_SOURCE.DEGREE_SEARCH,
dataSourceAsuOnline = DATA_SOURCE.ASU_ONLINE,
dataSourceCountriesStates = DATA_SOURCE.COUNTRIES_STATES,
submissionUrl,
} = props;

Expand Down Expand Up @@ -134,28 +134,6 @@ const AsuRfi = props => {

export { AsuRfi };

// Props
AsuRfi.defaultProps = {
variant: undefined, // default set in appState
campus: undefined,
actualCampus: undefined,
college: undefined,
department: undefined,
studentType: undefined,
areaOfInterest: undefined,
areaOfInterestOptional: false,
programOfInterest: undefined,
programOfInterestOptional: false,
isCertMinor: false,
country: undefined,
stateProvince: undefined,
successMsg: undefined,
test: false,
dataSourceDegreeSearch: DATA_SOURCE.DEGREE_SEARCH,
dataSourceAsuOnline: DATA_SOURCE.ASU_ONLINE,
dataSourceCountriesStates: DATA_SOURCE.COUNTRIES_STATES,
};

AsuRfi.propTypes = {
appPathFolder: PropTypes.string,
variant: PropTypes.oneOf(["rfiVariant1", "rfiVariant2"]),
Expand Down
9 changes: 2 additions & 7 deletions packages/app-rfi/src/components/controls/RfiCheckboxSingle.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@ const RfiCheckboxSingle = ({
id,
name,
value,
requiredIcon,
required,
requiredIcon = undefined,
required = undefined,
onBlur,
}) => {
const [field, meta] = useField({ name, type: "checkbox" });
Expand Down Expand Up @@ -41,11 +41,6 @@ const RfiCheckboxSingle = ({
);
};

RfiCheckboxSingle.defaultProps = {
requiredIcon: undefined,
required: undefined,
};

RfiCheckboxSingle.propTypes = {
children: PropTypes.node.isRequired,
onBlur: PropTypes.func,
Expand Down
18 changes: 5 additions & 13 deletions packages/app-rfi/src/components/controls/RfiDateInput.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,11 @@ import { RfiLabel, RfiError } from "./controls-helpers";
const RfiDateInput = ({
label,
name,
id,
requiredIcon,
required,
helperText,
autoFocus,
id = undefined,
requiredIcon = undefined,
required = undefined,
helperText = undefined,
autoFocus = undefined,
onBlur,
}) => {
// Surface values from Formik context
Expand Down Expand Up @@ -75,14 +75,6 @@ const RfiDateInput = ({
// duplicate the setting in our props got displaying the required icon until
// Formik has a better way to do it.

RfiDateInput.defaultProps = {
id: undefined,
requiredIcon: undefined,
required: undefined,
autoFocus: undefined,
helperText: undefined,
};

RfiDateInput.propTypes = {
label: PropTypes.string.isRequired,
name: PropTypes.string.isRequired,
Expand Down
15 changes: 4 additions & 11 deletions packages/app-rfi/src/components/controls/RfiEmailInput.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,10 +10,10 @@ import { RfiLabel, RfiError } from "./controls-helpers";
const RfiEmailInput = ({
name,
label,
id,
requiredIcon,
required,
autoFocus,
id = undefined,
requiredIcon = undefined,
required = undefined,
autoFocus = undefined,
onBlur,
}) => (
<Field name={name}>
Expand Down Expand Up @@ -45,13 +45,6 @@ const RfiEmailInput = ({
</Field>
);

RfiEmailInput.defaultProps = {
id: undefined,
requiredIcon: undefined,
required: undefined,
autoFocus: undefined,
};

RfiEmailInput.propTypes = {
id: PropTypes.string,
label: PropTypes.string.isRequired,
Expand Down
15 changes: 4 additions & 11 deletions packages/app-rfi/src/components/controls/RfiPhone.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,10 @@ import { RfiLabel, RfiError } from "./controls-helpers";
const RfiPhone = ({
label,
name,
id,
requiredIcon,
required,
helperText,
id = undefined,
requiredIcon = undefined,
required = undefined,
helperText = undefined,
onBlur,
}) => {
// Surface values from Formik context
Expand Down Expand Up @@ -85,13 +85,6 @@ const RfiPhone = ({
// duplicate the setting in our props got displaying the required icon until
// Formik has a better way to do it.

RfiPhone.defaultProps = {
id: undefined,
requiredIcon: undefined,
required: undefined,
helperText: undefined,
};

RfiPhone.propTypes = {
label: PropTypes.string.isRequired,
name: PropTypes.string.isRequired,
Expand Down
18 changes: 5 additions & 13 deletions packages/app-rfi/src/components/controls/RfiSelect.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,14 +11,14 @@ import { RfiLabel, RfiError } from "./controls-helpers";
// experienced using solely one of the other.

const RfiSelect = ({
id,
id = undefined,
label,
name,
requiredIcon,
required,
requiredIcon = undefined,
required = undefined,
options,
disabled,
autoFocus,
disabled = undefined,
Copy link

Copilot AI Nov 5, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The original defaultProps specified disabled: false, but the new default is undefined. This changes the component behavior when disabled is not provided. The default should be false to maintain backward compatibility.

Suggested change
disabled = undefined,
disabled = false,

Copilot uses AI. Check for mistakes.
autoFocus = undefined,
onBlur,
}) => {
const [field, meta, helpers] = useField({ name });
Expand Down Expand Up @@ -74,14 +74,6 @@ const RfiSelect = ({
// duplicate the setting in our props for displaying the required icon until
// Formik has a better way to do it.

RfiSelect.defaultProps = {
id: undefined,
requiredIcon: undefined,
required: undefined,
autoFocus: undefined,
disabled: false,
};

RfiSelect.propTypes = {
id: PropTypes.string,
label: PropTypes.string.isRequired,
Expand Down
21 changes: 6 additions & 15 deletions packages/app-rfi/src/components/controls/RfiTextArea.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,12 @@ import { RfiLabel, RfiError } from "./controls-helpers";
const RfiTextArea = ({
label,
name,
id,
requiredIcon,
required,
autoFocus,
disabled,
helperText,
id = undefined,
requiredIcon = undefined,
required = undefined,
autoFocus = undefined,
disabled = false,
helperText = undefined,
onBlur,
}) => (
<Field name={name}>
Expand Down Expand Up @@ -52,15 +52,6 @@ const RfiTextArea = ({
// duplicate the setting in our props got displaying the required icon until
// Formik has a better way to do it.

RfiTextArea.defaultProps = {
id: undefined,
requiredIcon: undefined,
required: undefined,
autoFocus: undefined,
disabled: false,
helperText: undefined,
};

RfiTextArea.propTypes = {
label: PropTypes.string.isRequired,
name: PropTypes.string.isRequired,
Expand Down
18 changes: 5 additions & 13 deletions packages/app-rfi/src/components/controls/RfiTextInput.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,11 @@ import { RfiLabel, RfiError } from "./controls-helpers";
const RfiTextInput = ({
label,
name,
id,
requiredIcon,
required,
helperText,
autoFocus,
id = undefined,
requiredIcon = undefined,
required = undefined,
helperText = undefined,
autoFocus = undefined,
onBlur,
}) => {
// Surface values from Formik context
Expand Down Expand Up @@ -69,14 +69,6 @@ const RfiTextInput = ({
// duplicate the setting in our props got displaying the required icon until
// Formik has a better way to do it.

RfiTextInput.defaultProps = {
id: undefined,
requiredIcon: undefined,
required: undefined,
autoFocus: undefined,
helperText: undefined,
};

RfiTextInput.propTypes = {
label: PropTypes.string.isRequired,
name: PropTypes.string.isRequired,
Expand Down
21 changes: 3 additions & 18 deletions packages/app-rfi/src/components/controls/controls-helpers.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ const GaEventPropTypes = {
text: PropTypes.string,
};

const RfiLabel = ({ label, name, id, requiredIcon }) => (
const RfiLabel = ({ label, name, id = undefined, requiredIcon = undefined }) => (
<label htmlFor={id || name}>
{requiredIcon && (
<>
Expand All @@ -29,7 +29,7 @@ const RfiLabel = ({ label, name, id, requiredIcon }) => (
</label>
);

const RfiLegend = ({ label, requiredIcon }) => (
const RfiLegend = ({ label = undefined, requiredIcon = undefined }) => (
<legend className="fw-bold">
{requiredIcon && (
<>
Expand All @@ -43,7 +43,7 @@ const RfiLegend = ({ label, requiredIcon }) => (
</legend>
);

const RfiError = ({ isError, metaError }) => (
const RfiError = ({ isError = undefined, metaError = undefined }) => (
<div role="alert">
{isError && (
<small className="form-text invalid-feedback">
Expand All @@ -59,33 +59,18 @@ const RfiError = ({ isError, metaError }) => (
// duplicate the setting in our props got displaying the required icon until
// Formik has a better way to do it.

RfiLabel.defaultProps = {
id: undefined,
requiredIcon: undefined,
};

RfiLabel.propTypes = {
label: PropTypes.string.isRequired,
name: PropTypes.string.isRequired,
id: PropTypes.string,
requiredIcon: PropTypes.bool,
};

RfiLegend.defaultProps = {
label: undefined,
requiredIcon: undefined,
};

RfiLegend.propTypes = {
label: PropTypes.string.isRequired,
requiredIcon: PropTypes.bool,
};

RfiError.defaultProps = {
isError: undefined,
metaError: undefined,
};

RfiError.propTypes = {
isError: PropTypes.bool,
metaError: PropTypes.string,
Expand Down
10 changes: 1 addition & 9 deletions packages/component-footer/src/components/Contact/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import { ColumnSection } from "../ColumnSection";
*/

const Contact = ({
contact: { title, contactLink, contributionLink, columns },
contact: { title = "", contactLink = "", contributionLink = "", columns = []},
}) => {
return (
<div className="wrapper" id="wrapper-footer-columns" data-testid="contact">
Expand Down Expand Up @@ -72,12 +72,4 @@ Contact.propTypes = {
}),
};

Contact.defaultProps = {
contact: {
title: "",
contactLink: "",
contributionLink: "",
},
};

export { Contact };
15 changes: 1 addition & 14 deletions packages/component-footer/src/components/Social/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ const DEFAULT_GA_EVENT = {
* @returns {JSX.Element}
*/

const Social = ({ social: { logoUrl, unitLogo, mediaLinks } }) => {
const Social = ({ social: { logoUrl, unitLogo = endorsedLogo, mediaLinks = {facebook: "", twitter: "", linkedIn: "", instagram: "", youtube: ""} } }) => {
Copy link

Copilot AI Nov 5, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The propTypes definition marks unitLogo as isRequired, but the destructuring now provides a default value. This creates a conflict between the validation and the actual behavior. Either remove isRequired from the PropType at line 158, or restructure the code to handle defaults without nested destructuring.

Copilot uses AI. Check for mistakes.
Copy link

Copilot AI Nov 5, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The inline object with multiple properties reduces readability. Consider defining the default mediaLinks object as a constant outside the function, similar to how DEFAULT_GA_EVENT is defined at line 17-20.

Copilot uses AI. Check for mistakes.
Copy link
Contributor

@davidornelas11 davidornelas11 Nov 5, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@oatkar This is actually a decent suggestion from copilot. Can you create a separate const with those values in medialinks and just assign it to mediaLinks

return (
<div className="wrapper" id="wrapper-endorsed-footer" data-testid="social">
<div className="container" id="endorsed-footer">
Expand Down Expand Up @@ -166,17 +166,4 @@ Social.propTypes = {
}),
};

Social.defaultProps = {
social: {
unitLogo: endorsedLogo,
mediaLinks: {
facebook: "",
twitter: "",
linkedIn: "",
instagram: "",
youtube: "",
},
},
};

export { Social };
Loading