-
Improvement
-
Resolution: Fixed
-
Normal
-
None
-
None
-
None
This assumes that you have successfully setup local BookBrainz server and created a Metabrainz JIRA account. If not, go back to the Task description and come back to proceed further!
Below are a list of sub-tasks available that you need to choose from. Select an unclaimed sub-task and assign it to yourself (Only one sub-task per participant). Each sub-task includes some information about a file that you will be working on. Locate and open that file in your editor.
We are updating our icons library. The goal is to replace all the existing FontAwesome icons with newer ones, in the file you are assigned to. This involves:
- Importing the new FontAwesomeIcon from package `@fortawesome/react-fontawesome`
import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
- Replacing all the icons present one by one:
<FontAwesome> element with <FontAwesomeIcon> element
Rename the property- 'name' to 'icon' (All other properties like size, className etc remains the same)
For example,<FontAwesome className="contact-text" name="comment" size="2x"/>
becomes
<FontAwesomeIcon className="contact-text" icon="comment" size="2x"/>
- And finally removing the import of old FontAwesome
i.e. removing the lineimport FontAwesome from 'react-fontawesome';
You can also have a look at this already migrated file to get a better understanding!
Save the changes and start the local server using `./develop.sh`. Wait until the console output gets quiet and this line appears:
> cross-env SSR=true node ./lib/server/app.js
After a few seconds, point your browser to localhost:9099 and thoroughly check the page you have updated the icons in.
P.S - If an icon doesn't appear as expected, you can cross-check if it exists in the Bookbrainz project Icon library and search the FontAwesome's Icon Library for finding appropriate icon names.
Now it's time to commit your changes, push them to your remote repository and make a Pull Request!
Not sure how to fork, branch, or create pull requests? Have a look at this guide