Feature/786 onboarding wizard

[Kolawole99]

Problem

[Provide a brief description of the problem that you are trying to solve with this pull request.]

Solution

[Provide a detailed explanation of the solution you are proposing, including any relevant code snippets or screenshots.]

Changes Made

• [List the changes you made in this pull request, including any new features or bug fixes.]

How to Test

[Provide instructions on how to test the changes you made, including any relevant details like configuration steps or data to be used for testing.]

Screenshots

[Include screenshots, if relevant, to help reviewers understand the changes you made.]

Notes

[Any additional notes or information that you would like to share with the reviewers.]

Checklist

• Code follows the contributing guidelines
• Changes have been thoroughly tested
• Documentation has been updated, if necessary
• Any dependencies have been added to the project, if necessary

Reviewers

@[username of the reviewer]

[mlabouardy]

Looks great, do you mind fixing the conflicts so we can complete the review 🙏🏻

[Kolawole99]

@mlabouardy and @ShubhamPalriwala I have rebased my branch on master and updated the PR, this seems to have handled the merge conflict, kindly review and provide feedback.

[ShubhamPalriwala]

Hey @Kolawole99, just reviewed the PR at the code-level and absolutely amazing work on this 💯! You defined type-casting as well for most of the minute details as well. Hats off 🥇

Just a few small nits here and there,

• For the react components in dashboard/components/icons: Can we save them as SVG somewhere in the public/assets/img and import that SVG here. This would improve the code modularity. Do you think this is possible?
• For all the pending tasks ie the routes in the backend. input file parsing, can we add a comment line starting with something like: // TODO: (onboarding-wizard) so that we have easier visibility on the pending tasks?
• For the providers components under the dashboard/pages/onboarding/<provider>.tsx, can we move them to dashboard/pages/onboarding/providers/<provider>.tsx ? Not sure if it is the best name though, what do you think?
• For all the uses of const provider = 'digitalocean', can we have an enum data class/interface which we can use across the project in the future as well? this would avoid string typos/casing errors and more uniform usability across the project?

Let me know if you need any help on the above from my end, would be an honour to help you wherever you face any issues!

I'll now give the feature a try locally 🙌🏼 and see if I can help anywhere in any improvements, which I highly doubt after the sneak peaks I took from the community calls haha, they were top notch 💯

[Kolawole99]

@ShubhamPalriwala and @mlabouardy I have handled all the requested changes for the PR.

• I have streamlined the betaFlagOnboardingWizard feature context so there is one single source of truth.
• I have updated all pages to use accurate names and naming conventions.
• I also switched the folder structure to provider to house all cloud provider files for ease of update as suggested by Shubham.
• I have also annotated all the required portions of the codebase with TODO: (onboarding-wizard): <comment>. The comment is replaced with a little explanation of the steps that could be taken to complete that feature, so we have focus points for continuous updates and progress to the Onboarding Wizard.

[Kolawole99]

@ShubhamPalriwala I did not make changes to the Components in the icon folder because there are also other reusable components there that return SVGs, I feel we could leave the icons there since that has been a convention, with just some icons placed in the public folder.

[ShubhamPalriwala]

Hey @Kolawole99, the code now LGTM! 🚀 thanks a ton for this!