Skip to content
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.

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

Component refactor for React class components #5393

Open
Aminehassou opened this issue May 15, 2023 · 50 comments · May be fixed by #5601
Open

Component refactor for React class components #5393

Aminehassou opened this issue May 15, 2023 · 50 comments · May be fixed by #5601

Comments

@Aminehassou
Copy link
Contributor

Aminehassou commented May 15, 2023

Current Behavior:

At the moment, the React side of the codebase still uses around 163 class components. 134 of those class components use the legacy createReactClass method while the other 29 class components use the newer class definitions. The 29 class components should be the main focus for the refactor. Once those are done, we can move on to the more legacy classes

Desired Behavior:

Preferably, we want to only use functional components. Thus, converting the remaining class components into functional components would be a nice code quality improvement.

Checklist for newer classes to be converted:

  • AdminAlerts
  • CampaignAlerts
  • CourseAlertsList
  • TaggedCourseAlerts
  • BadWorkAlert
  • ArticleViewer
  • AssignButton
  • LanguagePicker
  • NotificationsBell
  • SyllabusUpload
  • ProgressTracker
  • Assignment
  • MyArticlesContainer
  • MyExercisesContainer
  • StudentRevisionsList
  • EnrollButton
  • Articles
  • Overview
  • StudentDrawer
  • DeleteNote
  • NewReplyForm
  • Sidebar
  • TicketShowHandler
  • TicketsHandler
  • Upload
  • FollowUpQuestionResults
  • QuestionResults
  • RangeGraph
  • TextResults

Checklist for legacy classes to be converted:

  • ActivityHandler
  • ActivityTableRow
  • ActivityTable
  • DidYouKnowHandler
  • PlagiarismHandler
  • RecentEditsHandler
  • RecentUploadsHandlerBase
  • AlertsHandler
  • ArticleFinderRow
  • ArticleFinder
  • AddAvailableArticles
  • ArticleGraphs
  • ArticleList
  • Article
  • ArticlesHandler
  • AvailableArticle
  • AvailableArticles
  • CourseOresPlot
  • CourseQualityProgressGraph
  • EditSizeGraph
  • Wp10Graph
  • AssignmentList
  • Assignment
  • CampaignOresPlot
  • Campaign
  • AddCategoryButton
  • CategoryHandler
  • AcademicSystem
  • Affix
  • Calendar
  • Checkbox
  • Confirm
  • DatePicker
  • Feedback
  • FinalArticleChecklist
  • GetHelpButton
  • List
  • MainspaceChecklist
  • Modal
  • MultiSelectField
  • Notifications
  • PeerReviewChecklist
  • TextAreaInput
  • TextInput
  • WeekdayPicker
  • WikiSelect
  • CourseAlert
  • CourseAlerts
  • Course
  • CourseCreator
  • NewAccountButton
  • Conditional
  • EditableRedux
  • Expandable
  • InputHOC
  • PopoverExpandable
  • CustomLink
  • HamburgerMenu
  • Nav
  • Finished
  • Form
  • Intro
  • Permissions
  • OnboardingSupplementary
  • AvailableActions
  • CampaignEditable
  • CourseClonedModal
  • CourseStatsDownloadModal
  • CourseTypeSelector
  • Description
  • Details
  • EmbedStatsButton
  • GreetStudentsButton
  • Milestones
  • Overview
  • SalesforceLink
  • StatisticsUpdateInfo
  • TagEditable
  • YesNoSelector
  • DiffViewer
  • RevisionList
  • RevisionHandler
  • SettingsHandler
  • AddAdminButton
  • AddAdminForm
  • AddSpecialUserButton
  • AddSpecialUserForm
  • AdminUser
  • CourseCreationSettingsForm
  • DefaultCampaignForm
  • SalesforceCredentialsForm
  • SpecialUser
  • UpdateCourseCreationSettings
  • UpdateDefaultCampaignSetting
  • UpdateSalesforceCredentials
  • RandomPeerAssignButton
  • Student (in Articles/SelectedStudent/ExercisesList/StudentExercise)
  • StudentsTabHandler
  • Student (in shared/StudentList/Student)
  • PossiblePlagiarismHandler
  • SuspectedPlagiarismList
  • BlockTypeSelect
  • Block
  • EmptyWeek
  • Meetings
  • TimelineHandler
  • Timeline
  • Week
  • TrainingModules
  • TrainingModulesViewMode
  • UploadList
  • UploadViewer
  • UploadsHandler
  • ContributionStats
  • CourseDetails
  • InstructorStats
  • UserProfile
  • UserTrainingStatus
  • UserUploads
  • CoursesTaughtGraph
  • StudentsTaughtGraph
  • FormPanel
  • Option
  • Panel
  • SummaryPanel
  • Wizard
  • PopoverExample
  • Quiz
  • SlideLink
  • SlideMenu
  • TrainingModuleHandler
@amjido-01
Copy link

Now run yarn start

On Fri, 3 Nov 2023, 3:21 pm amjido_01, @.> wrote: have you ran a yarn install or npm install this is what happen after installing yarn, does this means everything is fine? [image: yarninstall] https://user-images.githubusercontent.com/96017433/280306766-32b26d02-8503-4039-b970-8cc940d002f0.jpg — Reply to this email directly, view it on GitHub <#5393 (comment)>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AEG4BACPGJCVXQUNPWNCPWLYCT4V5AVCNFSM6AAAAAAYCO6CH6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTOOJSGUZDIOBUGA . You are receiving this because you were mentioned.Message ID: @. com>

after running yarn start, this is what i got
yarnstart

@amjido-01
Copy link

@justiceotuya is everything fine?

@amjido-01
Copy link

ystart
after running yarn start.
@ragesoss @justiceotuya

@justiceotuya
Copy link
Contributor

justiceotuya commented Nov 3, 2023 via email

@amjido-01
Copy link

if you are using windows, follow this step https://github.com/WikiEducationFoundation/WikiEduDashboard/blob/master/docs/ubuntu_wsl_setup.md

On Fri, Nov 3, 2023 at 2:12 PM amjido_01 @.> wrote: I literally don't know what is happening along the way — Reply to this email directly, view it on GitHub <#5393 (comment)>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AEG4BAHXSNQ6253EIAIXDM3YCTUS7AVCNFSM6AAAAAAYCO6CH6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTOOJSGQYTINZYHE . You are receiving this because you commented.Message ID: @. com>

yep that is exactly what i followed, and everything seems good except the last step that ask to run the command of "yarn build" then i get that error that i show

@amjido-01
Copy link

@ragesoss @justiceotuya I mean the second to the last step that said to run "yarn build" is what is giving me error
settings

@justiceotuya
Copy link
Contributor

ok run bundle install

@amjido-01
Copy link

@justiceotuya ok sir, let me give it a try

@amjido-01
Copy link

@justiceotuya done with the bundle installation, what next sir

@amjido-01
Copy link

@justiceotuya this is what i get after installing bundler.
bundler

@justiceotuya
Copy link
Contributor

justiceotuya commented Nov 3, 2023 via email

@amjido-01
Copy link

@justiceotuya then after installing the bundler, I then try running "yarn build" as stated in the setup.md. then this happen.
build

@amjido-01
Copy link

amjido-01 commented Nov 3, 2023

@ragesoss @justiceotuya cannot load database configuration:
when i run "yarn start"

@justiceotuya
Copy link
Contributor

justiceotuya commented Nov 3, 2023 via email

@amjido-01
Copy link

Please follow the documentation on how to setup your database

On Fri, 3 Nov 2023, 4:26 pm amjido_01, @.> wrote: @justiceotuya https://github.com/justiceotuya then after installing the bundler, I then try running "yarn build" as stated in the setup.md. then this happen. [image: build] https://user-images.githubusercontent.com/96017433/280330371-8d8e4fda-ddda-476d-a1e3-108d9c51b11a.jpg — Reply to this email directly, view it on GitHub <#5393 (comment)>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AEG4BADOVH7TLQJQRCB7V5TYCUEIZAVCNFSM6AAAAAAYCO6CH6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTOOJSGY2DMMBVHE . You are receiving this because you were mentioned.Message ID: @. com>

ok sir, thank you

@sandygudie
Copy link

Hello @ragesoss
I am interested in contributing.
Please add me to the Slack group. Email is goodnewssandy@gmail.com
Thanks

@amjido-01
Copy link

hi @ragesoss I have set up the project locally just recently for the first time, but when I close the project and then later on try to run it again, I keep getting some weird issues, like "500 Internal Server Error
If you are the administrator of this website, then please read this web application's log file and/or the web server's log file to find out what went wrong."
please can you help me out.

@ragesoss
Copy link
Member

This is not the right place for setup issues @amjido-01 . Check the troubleshooting docs, and then post on the dedicated setup problems issue if you're still stuck.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
8 participants