oppia / oppia

A free, online learning platform to make quality education accessible for all.
https://www.oppia.org
Apache License 2.0
5.64k stars 3.79k forks source link

Migrate directives/controllers to Angular components #9749

Closed bansalnitish closed 1 year ago

bansalnitish commented 3 years ago

This issue aims to migrate directives/controllers written in AngularJS to modern Angular components.

We would request you to pick up any directive of your choice from core/templates/pages or core/templates/components. After you've picked up a directive, please mention the directive name that you want to take up. We will assign that particular directive to you and keep a track so that there is no duplication of work that goes along. After you're assigned, please go ahead and read this wiki page:https://github.com/oppia/oppia/wiki/Angular-Migration#implementation-details-to-migrate-directives, it has all the steps mentioned clearly that will help you to migrate the directives/controllers.

Also, make sure all the services that your directive is using are migrated to Angular.

Please feel free to reach out to @nithusha21 and @darksun27 in case you have any issues.

Some useful videos

How to find usages of your PR: https://vimeo.com/442416282 How to check your PR : https://vimeo.com/440915367 (This is an example on how to check topic landing page)

Unclaimed directives:

Claimed directives:

Note: For a guide on how to access Oppia's webpages, see this.

ashutoshc8101 commented 3 years ago

@DubeySandeep @srijanreddy98 @kevintab95 I am working on skill-selector.directive.ts. Please assign this to me. Will submit PR soon.

jcqli commented 3 years ago

@DubeySandeep @srijanreddy98 @kevintab95 I am working on skill-selector.directive.ts. Please assign this to me. Will submit PR soon.

@ashutoshc8101 Hey! I've actually been working on skill-selector, the list is a bit confusing since some of the unclaimed ones are actually claimed but not completed.

ashutoshc8101 commented 3 years ago

@jcqli is it done? Or work is in progress.??

jcqli commented 3 years ago

@jcqli is it done? Or work is in progress.??

Work in progress

ashutoshc8101 commented 3 years ago

@jcqli I can share my code with you. So, you can incorporate the parts you like and make your work better.

jcqli commented 3 years ago

@jcqli I can share my code with you. So, you can incorporate the parts you like and make your work better.

Oh, thank you, I appreciate it! #11791 is my draft PR if you wanted to take a look

ashutoshc8101 commented 3 years ago

@jcqli I can see that skill-selector.component.ts is still incomplete. You will face some pitfalls migrating it. I have already faced those pitfalls during my work. I can help to complete work on skill-selector.component.ts if you like. I also made a better pipe.

ashutoshc8101 commented 3 years ago

subtopic-viewer-navbar-pre-logo-action.component.ts is listed both in claimed and unclaimed directives. please fix.

ashutoshc8101 commented 3 years ago

@DubeySandeep @srijanreddy98 @kevintab95 I want to work on admin-jobs-tab.directive.ts. Please assign this file to me.

ashutoshc8101 commented 3 years ago

@DubeySandeep @srijanreddy98 @kevintab95 I am working on admin-config-tab.directive.ts. Will submit PR soon.

Radesh-kumar commented 3 years ago

@DubeySandeep @srijanreddy98 @kevintab95 I am working on admin-config-tab.directive.ts. Will submit PR soon.

@ashutoshc8101 I'm working on admin-config-tab.directive.ts Btw admin-jobs-tab.directive.ts is done or WIP? @nithusha21 can you please assign?

ashutoshc8101 commented 3 years ago

@DubeySandeep @srijanreddy98 @kevintab95 I am working on admin-config-tab.directive.ts. Will submit PR soon.

@ashutoshc8101 I'm working on admin-config-tab.directive.ts Btw admin-jobs-tab.directive.ts is done or WIP? @nithusha21 can you please assign?

It is done and I have submited a PR.

Radesh-kumar commented 3 years ago

It is done and I have submitted a PR.

@ashutoshc8101 So, my PR got merged regarding admin-backend-api-service it might cause conflicts https://github.com/oppia/oppia/pull/11446/files can you ping your mail or something?

Radesh-kumar commented 3 years ago

Send me link your PR here.

https://github.com/oppia/oppia/pull/11446/files

ashutoshc8101 commented 3 years ago

@Radesh-kumar Thankyou, The conflicts are resolved now.

ashutoshc8101 commented 3 years ago

@Radesh-kumar Are you working on schema-based-editor.directive too or it is just admin-config-tab.directive?? I am migrating this complete folder. If you already have migrated this folder. Then I will leave migration of admin-config-tab upto you. Screenshot from 2021-03-04 17-45-37

Radesh-kumar commented 3 years ago

schema-based-editor.directive

I'm not working on schema-based-editor.directive

ashutoshc8101 commented 3 years ago

@Radesh-kumar Ok, I will not work on admin-config.tab. I will just submit PR just for schema-based-editor. Does this seem fine to you??

Radesh-kumar commented 3 years ago

@Radesh-kumar Ok, I will not work on admin-config.tab. I will just submit PR just for schema-based-editor. Does this seem fine to you??

Yup sounds good!

Radesh-kumar commented 3 years ago

@nithusha21 please assign promo-bar.directive.ts

ashutoshc8101 commented 3 years ago

Please assign image-uploader.directive.ts

VallariAg commented 3 years ago

I want to work on alert-message.directive.ts. Please assign it to me.

pankajdahiya008 commented 3 years ago

I'm picking up library-footer.component.ts

pankajdahiya008 commented 3 years ago

I'm also picking up OppiaFooterDirective.ts as it is imported in library-footer.component.ts so working on both files. Thanks.

Radesh-kumar commented 3 years ago

I'm taking up learner-dashboard-page.component

Radesh-kumar commented 3 years ago

I'm picking up collection-summary-tile.directive and exploration-summary-tile.directive If anyone working on these files please ping in here.

ashutoshc8101 commented 3 years ago

I am working on create-activity-button.directive and its dependency exploration-creation.service.ts.

mridul-netizen commented 3 years ago

@ashutoshc8101 I'm currently working on it under top-navigation-bar directive can you pick some other file?

ashutoshc8101 commented 3 years ago

@mridul-netizen Ok, I will find something else.

VallariAg commented 3 years ago

Can I work on /core/templates/components/score-ring/score-ring.directive.ts? Also how do I access the pages, practice-session-page or review-test-page, where the question-player directive (which uses score-ring) is used?

HarshKhilawala commented 3 years ago

@darksun27 @nithusha21 Please assign me outcome-feedback-editor.directive.ts.

pankajdahiya008 commented 3 years ago

@darksun27 @nithusha21 Please assign me outcome-feedback-editor.directive.ts.

@HarshKhilawala Actually I am working on outcome-feedback-editor.directive.ts.

HarshKhilawala commented 3 years ago

Sure @pankajdahiyapd, I will find something else to work on. Thanks for informing!

MohdImran001 commented 3 years ago

@nithusha21 and @darksun27. I would like to work on html-select.directive.ts.

VallariAg commented 3 years ago

@nithusha21 @darksun27 I am working on components/score-ring/score-ring.directive.ts and I need help in locally accessing the pages where the component is used. I searched and it is used in practice-session-page and review-test-page, where the question-player directive (which uses score-ring) is used. Please help me access these pages locally.

pranjal930 commented 3 years ago

@nithusha21 @darksun27 I would like to work on outcome-feedback-editor.directive.ts.

pankajdahiya008 commented 3 years ago

@pranjal930 Actually I am working on outcome-feedback-editor.directive.ts.

HarshKhilawala commented 3 years ago

@nithusha21 @darksun27 I am taking up score-ring.directive.ts file !

pranjal930 commented 3 years ago

@nithusha21 @darksun27 I would like to work on schema-based-bool-editor.directive.ts

taiwo2 commented 3 years ago

11702 i would love to work on this, kindly assign it to me

div-yam commented 3 years ago

Hi Everyone! I was migrating continue-button.directive.ts directive to Angular Components, and the code is running fine. But it is showing the following error on pushing the branch

------------------------------------
Frontend Coverage Checks Not Passed.
------------------------------------
continue-button.component.ts seems to be fully covered! Before removing it manually from the denylist in the file scripts/check_frontend_test_coverage.py, please make sure you've followed the unit tests rules correctly on: https://github.com/oppia/oppia/wiki/Frontend-unit-tests-guide#rules

Push aborted due to failing frontend tests.

It would be a great help, if you could help me in fixing this issue. @nithusha21 @darksun27

Radesh-kumar commented 3 years ago

Hi Everyone! I was migrating continue-button.directive.ts directive to Angular Components, and the code is running fine. But it is showing the following error on pushing the branch

------------------------------------
Frontend Coverage Checks Not Passed.
------------------------------------
continue-button.component.ts seems to be fully covered! Before removing it manually from the denylist in the file scripts/check_frontend_test_coverage.py, please make sure you've followed the unit tests rules correctly on: https://github.com/oppia/oppia/wiki/Frontend-unit-tests-guide#rules

Push aborted due to failing frontend tests.

It would be a great help, if you could help me in fixing this issue. @nithusha21 @darksun27

@div-yam As the log suggests you should remove the corresponding spec file continue-button.component.ts from the check_frontend_test_coverage.py and then push your changes

Radesh-kumar commented 3 years ago

11702 i would love to work on this, kindly assign it to me

Hy @taiwo2 , I've already migrated promo-bar-directive https://github.com/oppia/oppia/pull/12110, feel free to pick up another file.

Radesh-kumar commented 3 years ago

@nithusha21 @darksun27 I am taking up score-ring.directive.ts file !

Hey @HarshKhilawala!, It seems @VallariAg already working on this issue. please pick up another issue.

div-yam commented 3 years ago

Hi Everyone! I was migrating continue-button.directive.ts directive to Angular Components, and the code is running fine. But it is showing the following error on pushing the branch

------------------------------------
Frontend Coverage Checks Not Passed.
------------------------------------
continue-button.component.ts seems to be fully covered! Before removing it manually from the denylist in the file scripts/check_frontend_test_coverage.py, please make sure you've followed the unit tests rules correctly on: https://github.com/oppia/oppia/wiki/Frontend-unit-tests-guide#rules

Push aborted due to failing frontend tests.

It would be a great help, if you could help me in fixing this issue. @nithusha21 @darksun27

@div-yam As the log suggests you should remove the corresponding spec file continue-button.component.ts from the check_frontend_test_coverage.py and then push your changes

Hi Everyone! I was migrating continue-button.directive.ts directive to Angular Components, and the code is running fine. But it is showing the following error on pushing the branch

------------------------------------
Frontend Coverage Checks Not Passed.
------------------------------------
continue-button.component.ts seems to be fully covered! Before removing it manually from the denylist in the file scripts/check_frontend_test_coverage.py, please make sure you've followed the unit tests rules correctly on: https://github.com/oppia/oppia/wiki/Frontend-unit-tests-guide#rules

Push aborted due to failing frontend tests.

It would be a great help, if you could help me in fixing this issue. @nithusha21 @darksun27

@div-yam As the log suggests you should remove the corresponding spec file continue-button.component.ts from the check_frontend_test_coverage.py and then push your changes

Thank You, it worked! @Radesh-kumar

VallariAg commented 3 years ago

@nithusha21 @darksun27 I am taking up score-ring.directive.ts file !

Hey @HarshKhilawala ! I am working on this file but I'm unable to locally access the page where the component is used. Please help me if you know how!

mridul-netizen commented 3 years ago

@VallariAg See the video in this PRs description https://github.com/oppia/oppia/pull/12295 you will get to see score-ring directive at the end.You can get access to the classroom page from admin-tab for visiting the practice-session page

HarshKhilawala commented 3 years ago

@VallariAg I will find something else for me. Hope you are able to locally access the page now

pranjal930 commented 3 years ago

Hello @nithusha21 @darksun27 Can you please tell me where can I locally access schema-based-bool-editor.directive.

Radesh-kumar commented 3 years ago

Hello @nithusha21 @darksun27 Can you please tell me where can I locally access schema-based-bool-editor.directive.

Hey @pranjal930, schema-based-bool-editor.directive has already been migrated by @ashutoshc8101 https://github.com/oppia/oppia/pull/12318 feel free to pick other files.