Wrap `KRadioButton` groups in `KRadioButtonGroup`

MisRob commented 2 months ago

🌱 Are you new to the codebase? Welcome! Please see the contributing guidelines.

Summary

https://github.com/learningequality/kolibri-design-system/pull/650 introduces a new Kolibri Design System component, KRadioButtonGroup that ensures expected keyboard navigation in Firefox https://github.com/learningequality/kolibri/issues/10491.

Now we need to update all places in Kolibri to use it.

References

Two first places are already updated in https://github.com/learningequality/kolibri/pull/12325
This will close https://github.com/learningequality/kolibri/issues/10491

Guidance

Find all <KRadioButton>s and wrap them in <KRadioButtonGroup> as described in https://develop--kolibri-design-system.netlify.app/kradiobutton/.
If the current Kolibri Design System release doesn't yet have KRadioButtonGroup available, you can use devserver-with-kds command to run Kolibri with your local KDS

Acceptance criteria

[ ] There is no KRadioButton left in Kolibri that's not wrapped in KRadioButtonGroup
[ ] There are no regressions in radio button functionality in any of the updated places

elkielki commented 2 months ago

Hi, can I get assigned to this issue?

MisRob commented 2 months ago

Hi @elkielki, thank you - yes. Please follow the guidance closely and ask here if anything comes up.

Also note that the newest Kolibri Design System that has <KRadioButtonGroup> available is not yet merged to Kolibri's develop and we currently have some issue with yarn linking these two repositories. I'd recommend that in your working branch, you change the two package.json's in the very same way as here https://github.com/learningequality/kolibri/pull/12616 and then run yarn install. Let us know if there are any issues.

adityashibu commented 2 months ago

Hi is the issue still open?

elkielki commented 2 months ago

@MisRob Feel free to reassign this issue to @adityashibu. I followed the 'Getting Started' documentation, but I'm stuck on the command nodeenv -p --node=18.19.0. For some reason, it's not installing npm.

AllanOXDi commented 2 months ago

Hi @elkielki I have unsigned you and assigned @adityashibu . Is there any error you are getting from the terminal that we can look at?

adityashibu commented 2 months ago

Hi @AllanOXDi, Just to make it clear, I need to wrap KRadioButton in KRadioButtonGroup right? So something along the lines of:

<KRadioButton
            v-for="language in languageCol"
            :key="language.id"
            ref="languageItem"
            v-model="selectedLanguage"
            :buttonValue="language.id"
            :label="language.lang_name"
            :title="language.english_name"
            class="language-name"
 />

would become:

<KRadioButtonGroup>
    <KRadioButton
                v-for="language in languageCol"
                :key="language.id"
                ref="languageItem"
                v-model="selectedLanguage"
                :buttonValue="language.id"
                :label="language.lang_name"
                :title="language.english_name"
                class="language-name"
     />
<KRadioButtonGroup />

Right?

MisRob commented 2 months ago

Hi @adityashibu, yes. I'd ask you to study the guidance and all the links in the issue description where you will find plenty of examples of simple use-cases as well as more complex ones, see what's already done, documentation for components you will work with, and understand how to test that it works as expected in Firefox.

As you navigate Kolibri and preview the places you're refactoring, would you always please make a note about how you navigated as a user to a given place, and include this in your pull request description? It will help our QA team to locate where to test. Doesn't need to be elaborate, just few steps to get to each of those places. Thanks a lot.

MisRob commented 2 months ago

@elkielki as @AllanOXDi mentioned, we're glad to help you debug your development server setup if you can give us some logs. Seems you're experiencing troubles with a node version managemen - many people have good experience with Volta.

MisRob commented 2 months ago

Note that https://github.com/learningequality/kolibri/pull/12325 was just merged so the two first places are addressed in the latest develop. cc @adityashibu

adityashibu commented 2 months ago

Sure I'll have a look at it :)

MisRob commented 1 month ago

Hi @adityashibu, are you working on this or planning to? Just to know if we should keep the assignment or not.

iamshobhraj commented 4 weeks ago

Hey @MisRob can you assign me this issue?

MisRob commented 4 weeks ago

Hi @iamshobhraj, yes, thank you

Maku38 commented 3 weeks ago

Hello , is this issue still open....if yes can u assign me?

bjester commented 3 weeks ago

@Maku38 this issue is currently assigned.

You’re welcome to find a "help wanted" issue with no assignee

harshmohite04 commented 2 weeks ago

/assign

AllanOXDi commented 2 weeks ago

Hey @iamshobhraj. Someone is already assigned to this issue. If you want to work on something else, check out these other issues labeled help wanted" issue with no assignee

iamshobhraj commented 1 week ago

@MisRob , I opened a pr for this issue

AllanOXDi commented 1 week ago

Hi @iamshobhraj,

Thank you for your contribution! Our team will review the PR and provide feedback soon.

yashsaraswat2004 commented 4 days ago

Is this issue still open?

AllanOXDi commented 4 days ago

Hi @yashsaraswat2004 .It's already assigned. If you want to work on something else, check out these other issues labeled help wanted" issue with no assignee

learningequality / kolibri