refactor: new join steps, social steps to use username, dribbble and replace company with college#1159
refactor: new join steps, social steps to use username, dribbble and replace company with college#1159MayankBansal12 wants to merge 4 commits into
Conversation
|
Important Review skippedAuto incremental reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Organization UI Review profile: ASSERTIVE Plan: Pro Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
WalkthroughThis PR fixes the "dribble" → "dribbble" typo across form mappings, constants, and components. It refactors social input fields in NewStepFour with custom HTML and username extraction helpers. It updates hardcoded URLs to fully qualified format and adds feedback history reversal logic. Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related issues
Possibly related PRs
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Deploying www-rds with
|
| Latest commit: |
66077eb
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://efa13714.www-rds.pages.dev |
| Branch Preview URL: | https://refactor-application.www-rds.pages.dev |
| HOME: `${SCHEME}dev.${DOMAIN}`, | ||
| WELCOME: `${SCHEME}staging-welcome.${DOMAIN}`, | ||
| GOTO: '/goto', | ||
| EVENTS: '/events', |
There was a problem hiding this comment.
these are changed to fix redirection in development env (to use dev.**.com)
There was a problem hiding this comment.
Actionable comments posted: 7
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@app/components/new-join-steps/new-step-four.hbs`:
- Around line 21-183: The template duplicates nearly identical social input
blocks; replace them with a config-driven loop that maps a list of social specs
(name, id, placeholder, required boolean, optional show flag key) and renders
one shared block using the existing helpers/handlers: this.getSocialPrefix,
this.inputHandler, this.data, and this.errorMessage. Implement a socials array
in the corresponding component/controller (each entry: key like
"twitter"/"github", required flag, optional showFlag name such as
"showGitHub"/"showBehance"/"showdribbble") and iterate in the HBS to
conditionally render based on the showFlag, binding name/id/value to data[key],
on-input to this.inputHandler, and error message to this.errorMessage[key];
preserve existing classes, required attributes, and prefix behavior so behavior
remains identical.
In `@app/components/new-join-steps/new-step-four.js`:
- Around line 71-86: extractUsername currently returns the first pathname
segment which yields "in" for LinkedIn (/in/username) and other platforms with
prefix segments; update extractUsername (and its use of socialFields) to return
the last meaningful segment when parsing URLs (e.g., use the final non-empty
segment from url.pathname.split('/').filter(Boolean)), and add a small
platform-specific override for cases like linkedin (if field === 'linkedin' &&
segments[0] === 'in' then return segments[1] ?? trimmedValue) so that username
extraction returns the actual username rather than a prefix.
- Around line 61-63: Rename the inconsistent getter showdribbble to showDribbble
to match camelCase used by showGitHub and showBehance; update the getter name in
the class (get showDribbble()) and change any template or component references
that read showdribbble to the new showDribbble identifier so usages remain
correct.
In `@app/components/new-join-steps/new-step-six.js`:
- Around line 46-48: Rename the getter showdribbble to showDribbble to follow
camelCase and match other getters like showGitHub and showBehance; update any
template or component references that bind to showdribbble (e.g., in the
template or JSX where it's used) to use showDribbble so usages remain
consistent, and ensure the same rename was applied in new-step-four.js if that
file was changed previously to avoid mismatches at runtime.
In `@app/components/new-join-steps/new-step-two.hbs`:
- Around line 29-31: The two label strings are inconsistent: the `@field`
attribute uses "Your institution/College" while the `@placeHolder` uses
"Institution or college name"; update these strings for consistent
capitalization (either make both "College" or both "college") by editing the
`@field` value ("Your institution/College") and the `@placeHolder` value
("Institution or college name") in the new-step-two component so the UI text
matches uniformly.
In `@app/constants/new-join-form.js`:
- Line 44: NEW_STEP_LIMITS.stepOne defines imageUrl: { min: 1 } but
new-step-one.js omits imageUrl from stepValidation so isDataValid() never
enforces the required-image rule; either add imageUrl to the stepValidation
object in new-step-one.js so the isDataValid() flow validates it, or remove
imageUrl from NEW_STEP_LIMITS.stepOne if file validation should remain only in
handleImageSelect(); update references to imageUrl, NEW_STEP_LIMITS.stepOne,
stepValidation, isDataValid(), and handleImageSelect() accordingly so the chosen
approach is consistently enforced.
In `@app/styles/application-detail.module.css`:
- Line 129: The CSS uses an undefined variable --color-lightgray causing
transparent backgrounds; update the selectors that reference it (notably
.social-link-pill and .feedback-header) to use the existing variable name
--color-lightgrey (or --color-light-gray if you prefer the hyphenated variant)
so the background resolves correctly; search for all occurrences of
--color-lightgray and replace them with the chosen defined variable
(--color-lightgrey) to keep naming consistent across the stylesheet.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
Run ID: 8317c6be-3c35-4b39-a45a-4eacb573d311
📒 Files selected for processing (18)
app/components/new-join-steps/base-step.jsapp/components/new-join-steps/new-step-four.hbsapp/components/new-join-steps/new-step-four.jsapp/components/new-join-steps/new-step-six.hbsapp/components/new-join-steps/new-step-six.jsapp/components/new-join-steps/new-step-two.hbsapp/components/signup-steps/step-zero.hbsapp/components/signup-steps/step-zero.jsapp/constants/applications.jsapp/constants/new-join-form.jsapp/constants/new-signup.jsapp/constants/urls.jsapp/controllers/applications/detail.jsapp/styles/application-detail.module.cssapp/styles/input.module.cssapp/templates/applications/detail.hbstests/integration/components/new-signup/info-test.jstests/integration/components/signup-steps/step-zero-test.js
| {{#if (or (not social.showFlag) (get this social.showFlag))}} | ||
| <div class="input-box input--full-width"> |
There was a problem hiding this comment.
what is this check for?
There was a problem hiding this comment.
to check if social Fields needs to be shown as per roles (eg: dribbble, behance only for designer, github only for developer)
Date: 18-03-26
Developer Name: @MayankBansal12
Issue Ticket Number:-
Description:
dribblewithdribbbleto stay consistent with original brand nameIs Under Feature Flag
Database changes
Breaking changes (If your feature is breaking/missing something please mention pending tickets)
Is Development Tested?
Tested in staging?
Add relevant Screenshot below ( e.g test coverage etc. )
screencast
create-demo.mp4