Improve mount point selector

[joseivanlopez]

When editing a file system, the form shows a disabled selector for the mount point field. Using a disabled widget does not make sense in this case because the mount point will never be editable. The disabled widget should be replaced by plain text.

Moreover, the selector currently uses a FormSelect component. It should be replaced by the Select component, similar to the file system type selector.

• https://github.com/openSUSE/agama/blob/master/web/src/components/storage/VolumeForm.jsx#L76

[itsrajshivhare]

Hi @joseivanlopez, I would like to work on the issue.

[joseivanlopez]

Hi @joseivanlopez, I would like to work on the issue.

Sure, go ahead with a pull request. Do you need help to start moving on? Thanks a lot!

[itsrajshivhare]

Thank you @joseivanlopez for your quick response! I'm eager to get started on contributing to the project.

[itsrajshivhare]

Hi @joseivanlopez, Apologies for reaching out at this moment. I'm facing challenges while setting up the project, encountering errors like "Cannot connect to the Cockpit server" (attached the photos for reference). Since I'm new to this, I would greatly appreciate your guidance and assistance.


Thanks for your understanding.

[joseivanlopez]

For running Agama you need to start both the Agama services (backend) and the web UI. Are you running the Agama services?

I would suggest to create a virtual machine and use it to run our live iso image.

Once the Agama live image is booted in your virtual machine, you can run the web UI from your git clone:

$ git clone https://github.com/openSUSE/agama
$ cd agama/web
$ npm install
$ COCKPIT_TARGET=<virtual-machine-ip> npm run server

Then point your browser to https://localhost:8080/. Probably you will be requested to enter username/password. If so, use root/linux.

Please, try it and let me know if it works. We can try another approach if it does not work. Thanks!

[nagu165]

Hey, I am working on this issue and I don't completely understand the first part you mentioned and am stuck on how to proceed there
And I also wanted your suggestion on making pull requests for minute changes that you mentioned in the second part (changing from formSelect to Select) without moving forward with the first part of the issue.
Thank you for the understanding.

[dgdavid]

Hey, I am working on this issue and

Hi @nagu165, thanks a lot and welcome aboard!

I don't completely understand the first part you mentioned and am stuck on how to proceed there

It's actually simple, the MountPointFormSelect at components/storage/VolumeForm.jsx should not be mounted when editing a volume. Instead, the mount point should be rendered as plain text (a.k.a.) string.

However, I admit that VolumesForm component could be a bit overwhelming at first sight, depending on your development background. So, don't worry and skip that part of the issue to make your first contribution and get familiar with the code.

And I also wanted your suggestion on making pull requests for minute changes that you mentioned in the second part (changing from formSelect to Select) without moving forward with the first part of the issue.

Just go ahead and open the PR if you have the change ready. During the code review we are gonna make suggestions and help you to move it on. The only thing I can suggest at this time is to make atomic, self-explanatory commits and to try to not forget about the tests 😇 but if you have doubts, just open the PR and let's work on it together.

Thank you for the understanding.

Anytime! It's our pleasure to help you to make a contribution to Agama... and try to keep you engaged 😜

[rohit9625]

Hello @dgdavid sir, I tried setting up the local environment and reached the login page of Agama. But for username - root and password - Linux, it's showing the wrong username or password.

[nagu165]

hello sir, I am trying to setup the project using the virtualBox and was confused on which version of linux to select here

and also wanted to ask u whether for the second part of the issue is this all u want (attached the screenshot) or else if anything is missing please do let me know

Thank you

[dgdavid]

Hello @dgdavid sir,

Hi @rohit9625

I tried setting up the local environment and reached the login page of Agama. But for username - root and password - Linux, it's showing the wrong username or password.

root/linux are the user/password for the Agama live ISOs. If you have set the environment in your own machine, the user and password are these you normally use for login into the system. PLEASE, be careful if you are doing so. My recomendation is to use a virtual machine for contributing to this project if you are not completely sure what you're doing.

[dgdavid]

hello sir, I am trying to setup the project using the virtualBox and was confused on which version of linux to select here

I'd choose openSUSE Tumbleweed (64-bit)

and also wanted to ask u whether for the second part of the issue is this all u want

Please, just open the PR if you don't mind. Making a picture-driven review is not the way we work. It will require a lot of effort from our side and, honestly, will be a full mess. Moreover, we have set some automated checks that help with the process by running linters and test suite. So, don't be shy and go ahead with the PR once you think you have everything in place: changes in the code, tests up-to-date, and ideally you have checked it manually too. From that point on, the YaST team could help you to move it on by making needed suggestions.

Thank you

Thanks to you for the time invested on contributing to Agama.

[nagu165]

Hello sir, Really sorry for the trouble but I needed a little clarification on the issue.
From what I understood by reading the code and test cases and @dgdavid sir's suggestion, I am assuming that when currentVolume is defined we need to show a text describing which volume was selected for mounting and when currentVolume is undefined we need to let the user select the volume from the list of volume templates where we will proceed with the installation right?. But when we replace the selector with the text the test cases suggest( I think ) that they need to find mountpointformselect component ( as combobox ).
I seem to have fixed the issue but when running the tests it's showing some errors, could you please provide a hint on where I might be wrong.

Thank you so much.

[dgdavid]

Hello sir, Really sorry for the trouble but I needed a little clarification on the issue. From what I understood by reading the code and test cases and @dgdavid sir's suggestion, I am assuming that when currentVolume is defined we need to show a text describing which volume was selected for mounting and when currentVolume is undefined we need to let the user select the volume from the list of volume templates where we will proceed with the installation right?.

That's right.

But when we replace the selector with the text the test cases suggest( I think ) that they need to find mountpointformselect component ( as combobox ). I seem to have fixed the issue but when running the tests it's showing some errors, could you please provide a hint on where I might be wrong.

Quite expected. Tests must be updated to the new behavior too. Do you need help understanding and updating the VolumeForm.test.jsx?

[dgdavid]

Quite expected. Tests must be updated to the new behavior too. Do you need help understanding and updating the VolumeForm.test.jsx?

Thinking it twice, maybe we can collaborate in this first contribution for speeding up the PR and continue helping you to get familiar with both, the Agama project and React Testing Library. The idea is that you can update the PR with changes done in VolumeForm.jsx and I'll update the test. Then, you can read my changes and ask anything it's not clear for your or even give us your feedback/review about these changes.

Once we have it ready, you should add the entry in the changes file and finally we can go ahead by merging your first contribution to Agama.

What do you think?

[nagu165]

Quite expected. Tests must be updated to the new behavior too. Do you need help understanding and updating the VolumeForm.test.jsx?

Thinking it twice, maybe we can collaborate in this first contribution for speeding up the PR and continue helping you to get familiar with both, the Agama project and React Testing Library. The idea is that you can update the PR with changes done in VolumeForm.jsx and I'll update the test. Then, you can read my changes and ask anything it's not clear for your or even give us your feedback/review about these changes.

Once we have it ready, you should add the entry in the changes file and finally we can go ahead by merging your first contribution to Agama.

What do you think?

Thank you so much for the suggestion sir, I would be glad to receive your help.
can you please tell me how I should get started. If you don't mind can you please inform me at what time you would be free to help me with the issues so that I will not disturb you when you are busy. Thank you so much.

[dgdavid]

Thank you so much for the suggestion sir, I would be glad to receive your help. can you please tell me how I should get started.

As said above, you can go ahead by updating your PR with your latest changes. I assume you're already familiar with both, git and Github, rigth?

If you don't mind can you please inform me at what time you would be free to help me with the issues so that I will not disturb you when you are busy. Thank you so much.

Sadly I cannot tell you a specific time slot. I could be either, busy or away of the keyboard.

Just go ahead and raise your questions. I'll answer them ASAP.

[nagu165]

Hello sir, This issue was solved with the PR 1007. And really sorry for asking like this but could you assign some small bugs to me that were not yet mentioned in the issues section I am a beginner and the current issues seem either too difficult or of some technology I don't know yet.

Thank you.

[dgdavid]

Hey @nagu165,

Right, this issue can be closed now. Thanks for the reminder.

In regard to looking for a small issue, while it's true I told you we can do it, sadly it is also a fact that I'm a bit busy at this moment helping the team to move a bunch of things on. I do not know when exactly I could take a break for creating well-defined good-first-issues. Maybe at the end of the second week of February.

However, I really appreciate your interest in the project and I wouldn't like to lose your willingness to help here :) So, I'd like to encourage you to contribute differently until you/we find a task you can tackle: by providing feedback. The idea is simple, you can go through the Agama UI and give us your feedback from the user perspective, especially what you find confusing or difficult to understand. I know, at first sight it can look boring or not interesting from a developer perspective, but believe me: it would be a great contribution and even a good learning opportunity since you can go through the related source code for having the complete picture before opening an issue or discussion.

Also, you can check open PRs (like this one I'm working on) and, apart from learning something from them, make suggestions or ask questions about the code before it gets merged.

Last but not least, you can also give us your view in open discussions, or even open a new one.

But they are just ideas for contributing without the need of making a PR for solving a specific issue. Of course, you can simply wait until we create more issues and find one that suits your expectations. Or maybe someone inside the @openSUSE/yast team have a clear idea of something small for you this week.

What do you think?

Regards.

[imobachgs]

Hi @nagu165,

As @dgdavid we are reorganizing some things but we plan to come up with some good first issues in a few weeks. Contributing to a project is not just writing code but giving feedback, opening issues, etc. We appreciate that 😉

However, if you want to try some coding, you could give issue #860 a try. What do you think?

[nagu165]

Hey @nagu165,

Right, this issue can be closed now. Thanks for the reminder.

In regard to looking for a small issue, while it's true I told you we can do it, sadly it is also a fact that I'm a bit busy at this moment helping the team to move a bunch of things on. I do not know when exactly I could take a break for creating well-defined good-first-issues. Maybe at the end of the second week of February.

However, I really appreciate your interest in the project and I wouldn't like to lose your willingness to help here :) So, I'd like to encourage you to contribute differently until you/we find a task you can tackle: by providing feedback. The idea is simple, you can go through the Agama UI and give us your feedback from the user perspective, especially what you find confusing or difficult to understand. I know, at first sight it can look boring or not interesting from a developer perspective, but believe me: it would be a great contribution and even a good learning opportunity since you can go through the related source code for having the complete picture before opening an issue or discussion.

Also, you can check open PRs (like this one I'm working on) and, apart from learning something from them, make suggestions or ask questions about the code before it gets merged.

Last but not least, you can also give us your view in open discussions, or even open a new one.

But they are just ideas for contributing without the need of making a PR for solving a specific issue. Of course, you can simply wait until we create more issues and find one that suits your expectations. Or maybe someone inside the @openSUSE/yast team have a clear idea of something small for you this week.

What do you think?

Regards.

Thank you for the response sir, I will look through the project as you have mentioned.

[nagu165]

Hi @nagu165,

As @dgdavid we are reorganizing some things but we plan to come up with some good first issues in a few weeks. Contributing to a project is not just writing code but giving feedback, opening issues, etc. We appreciate that 😉

However, if you want to try some coding, you could give issue #860 a try. What do you think?

Thank you sir, I will try my best.