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

Add loading animation for when playground generate models #1725

Open
jonaslagoni opened this issue Jan 4, 2024 · 19 comments
Open

Add loading animation for when playground generate models #1725

jonaslagoni opened this issue Jan 4, 2024 · 19 comments
Assignees
Labels
enhancement New feature or request good first issue Good for newcomers website Anything related to the website

Comments

@jonaslagoni
Copy link
Member

Reason/Context

https://modelina.org/playground

When you change the input, open the playground, or change the settings, the playground need to ask the backend to re-generate the models, and there can be a significant delay here depending on input and latency to the backend server. Therefore I suggest we add a loading screen to the output models view that showcases that it is currently in the process of being generated.

You can find the most relevant code for the playground here: https://github.com/asyncapi/modelina/blob/master/modelina-website/src/components/playground/Playground.tsx

And the output panel can be found here: https://github.com/asyncapi/modelina/blob/master/modelina-website/src/components/playground/OutputNavigation.tsx

@jonaslagoni jonaslagoni added enhancement New feature or request good first issue Good for newcomers website Anything related to the website labels Jan 4, 2024
@Gmin2
Copy link
Contributor

Gmin2 commented Jan 5, 2024

@jonaslagoni working on this

@Gmin2
Copy link
Contributor

Gmin2 commented Jan 8, 2024

@jonaslagoni we want to add the loading screen in the output models only or in the whole screen ?

@Gmin2 Gmin2 mentioned this issue Jan 8, 2024
3 tasks
@jonaslagoni
Copy link
Member Author

To me just the output models make sense to me, cause then the user can still change settings and input

@devilkiller-ag what do you think? 🤔

@devilkiller-ag
Copy link
Member

To me just the output models make sense to me, cause then the user can still change settings and input

@devilkiller-ag what do you think? 🤔

I also think that showing the loader on the output screen only will make more sense.

@Gmin2
Copy link
Contributor

Gmin2 commented Jan 8, 2024

check the PR added the loader in the output screen only

cc @jonaslagoni @devilkiller-ag

@ConnectBhawna
Copy link

If no one working on this issue would love to try it out @jonaslagoni @devilkiller-ag

@devilkiller-ag
Copy link
Member

If no one working on this issue would love to try it out @jonaslagoni @devilkiller-ag

Hi @ConnectBhawna, you can work on this issue. Make sure to go through #1730 to know the approach of previous PR on this issue.

@devilkiller-ag
Copy link
Member

Hi @ConnectBhawna, Do you have any updates on this?

@ConnectBhawna
Copy link

Yeahh almost done, will do the PR by this weekand

@devilkiller-ag
Copy link
Member

Hi @ConnectBhawna, how's the work going on? Feel free to share if you are facing any issue.

@Alokih
Copy link

Alokih commented Jun 12, 2024

Hey @devilkiller-ag i want to work on this issue, but I am unable to setup this project, can you help me a little bit ?

@devilkiller-ag
Copy link
Member

Hi @Alokih, you need to follow the instructions given in the readme file in the modelina-website folder. You need to first build the modelina using the command npm run build:modelina and then install the dependencies for the website.

@Alokih
Copy link

Alokih commented Jun 15, 2024

Thnx @devilkiller-ag

@Alokih
Copy link

Alokih commented Jun 15, 2024

Hey @devilkiller-ag I am attaching a screen recording, can you check it once , as you have not assigned me issue, can I create a PR ?

Screencast.from.15-06-24.10.46.05.PM.IST.webm

@devilkiller-ag
Copy link
Member

Hey @devilkiller-ag I am attaching a screen recording, can you check it once , as you have not assigned me issue, can I create a PR ?

Screencast.from.15-06-24.10.46.05.PM.IST.webm

@Alokih this looks good to me. You can open a PR so that I can do further checks.

@Alokih
Copy link

Alokih commented Jun 15, 2024

@devilkiller-ag I just wanted to tell that I have taken help from previous PR which was closed

@Girishbari
Copy link

@devilkiller-ag getting this error when I ran modelina-website
image

can you please share workaround for this or should I create a issue

@devilkiller-ag
Copy link
Member

@devilkiller-ag getting this error when I ran modelina-website
can you please share workaround for this or should I create a issue

Hi @Girishbari, Did you first build the modelina? First, you must run this command from inside the modelina-website folder: npm run build:modelina to build the modelina. I suggest you carefully follow the instructions in the website readme file. Goodluck! Feel free to ask any further questions if you get stuck.

@Girishbari
Copy link

thx, that really worked, I initally ran build command outside of modelina-website folder

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request good first issue Good for newcomers website Anything related to the website
Projects
None yet
6 participants