Setting up the React project

[drpiyadigama]

I've been trying to set up the results-tabulation-ui project which consists of the fronted of the project, but every time I try to run it on localhost:3000 it gets redirected to http://localhost:3001/tabulation/signin which gives the message "The site cannot be reached".

Do I need to set up the backend of the project as well to get the frontend to work?

Can someone pls guide me with the setup procedure for the frontend?

[Dinuka de Silva]

Hi Dinuka,

Thanks for reaching out. You have to set up the auth-app [1] and there's few configurations not properly documented for setting up that locally. The credentials on this are only for development testing purposes.  Let me give that here. This will direct the local auth-app to a dev instance of wso2 IS server and redirect back to the localhost upon successful login.

1) Do the following changes on "auth-app/routes/auth.js"

auth-app/routes/auth.js line 6-18

// Set the configuration settings
const credentials = {
  client: {
    id: 'Bc9am2voec_NAvfJA8KmpiZ0qAca',
    secret: 'hD3_9rDl6Khkb6uYd7vKmnc9ThYa'
  },
  auth: {
    tokenHost: 'https://apim-gateway.ecdev.opensource.lk/',
    tokenPath: 'token',
    authorizeHost: 'https://apim-gateway.ecdev.opensource.lk/',
    authorizePath: 'authorize'
  }
};

auth-app/routes/auth.js line 118-130

const tabulationConfig = {
  serverRedirectUri: 'http://localhost:3001/tabulation/auth/callback',
  clientRedirectUri: 'http://localhost:3000',
  isBaseUrl: 'https://apim-gateway.ecdev.opensource.lk/',
}

const tabulationCredentials = {
  client: {
    id: 'mJR3BTRiX3VbqAMxDHDDywaOaQQa',
    secret: 'GDhO_0xe3rgL4IZhiusZyZfz9eEa'
  },
  auth: credentials.auth
};

2) Election creation steps were just updated [2]. Check the latest.  

References

[1] https://github.com/ECLK/auth-app

[2] https://github.com/ECLK/results-tabulation/blob/master/results-tabulation-api/readme.md

Regards,

Dinuka

--
You received this message because you are subscribed to the Google Groups "LSF-Elections" group.
To unsubscribe from this group and stop receiving emails from it, send an email to lsf-election...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/lsf-elections/fe87d2ec-01b2-45e2-8b53-5a0255a9ab82%40googlegroups.com.

[Dinuka de Silva]

Hi Dinuka,

After creating an election, you could get the root-token for that election [5] and put it in the front end application [3]. Also, you could edit the token privileges by opening the root-token in a jwt editor [4].

And the local setup will be redirected to login which is redirected back to the front end with the token. But, since the local setup above is not going through that, you can actually login from any user but everything will be according to the token passed on the front end [3].

One static user available on dev is (dinuka/dinuka). You could use this.

On an additional note. Do not forget to copy the mailing list when you post or reply to a question unless it has any sensitive information. Open communication is always important. 😊

References

[3] https://github.com/ECLK/results-tabulation/blob/master/results-tabulation-ui/src/services/tabulation-api/index.js#L34

[4] https://www.jsonwebtoken.io/

[5] https://github.com/ECLK/results-tabulation/blob/master/results-tabulation-api/readme.md

Regards,

Dinuka

On Wed, Jun 3, 2020 at 2:41 PM Dinuka Piyadigama <drpiya...@gmail.com> wrote:

Hi Dinuka,

Thank you for guiding me through this. The login screen appears now.

Is there a username & password that I can use to get passed the login screen?

Regards,

Dinuka.

[Dinuka de Silva]

Hi Dinuka,

On Sat, 6 Jun 2020, 22:51 Dinuka Piyadigama, <drpiya...@gmail.com> wrote:

Hi Dinuka,

So, I created the virtual env and installed the requirements for the API.

According to the readme [1] I'm supposed to update the database connection parameters. Are there any parameters that I can use for this?

Not command line parameter I'm aware of. 

You have to have mysql running locally and updated the dev.cfg with port and credentials.

Then, there're 3 export statements create, upgrade DB and run local server. Can I know in which files exactly those export statements are?

I didn't get this. There are few files in the env folder for different environments. For local setup, it's dev.cfg. And there's an export of the dev.cfg on each command to make sure the correct env config is imported.

Each of these commands create the database, migrate and upgrade the database respectively. You only have to do create and migrate. Upgrade has to be executed only if you make any changes to the orm entities that causes a DDL change.

[1] https://github.com/ECLK/results-tabulation/blob/master/results-tabulation-api/readme.md

Regards,

Dinuka.

On Fri, Jun 5, 2020 at 8:35 PM Dinuka de Silva <din...@opensource.lk> wrote:

On Fri, Jun 5, 2020 at 7:31 PM Dinuka Piyadigama <drpiya...@gmail.com> wrote:

Hi Dinuka,

I tried signing-in using the static user, but it gives an unknown error. I've attached a screenshot below.

I haven't really worked with Flask. Is it necessary to get the API running as well to view the frontend functionalities?

Yes. the api is need to be running locally [6] 

I ran the auth-app in the background as well.

Would be great if I could figure out how to identify how the frontend functionalities work, in order to work towards fixing the issues posted on GitHub.

Regards,
Dinuka.

On Wed, Jun 3, 2020 at 3:44 PM Dinuka de Silva <din...@opensource.lk> wrote:

Hi Dinuka,

After creating an election, you could get the root-token for that election [5] and put it in the front end application [3]. Also, you could edit the token privileges by opening the root-token in a jwt editor [4].

And the local setup will be redirected to login which is redirected back to the front end with the token. But, since the local setup above is not going through that, you can actually login from any user but everything will be according to the token passed on the front end [3].

One static user available on dev is (dinuka/dinuka). You could use this.

On an additional note. Do not forget to copy the mailing list when you post or reply to a question unless it has any sensitive information. Open communication is always important. 😊

References

[3] https://github.com/ECLK/results-tabulation/blob/master/results-tabulation-ui/src/services/tabulation-api/index.js#L34

[4] https://www.jsonwebtoken.io/

[5] https://github.com/ECLK/results-tabulation/blob/master/results-tabulation-api/readme.md

[6] https://eclk.github.io/results-tabulation/results-tabulation-ui/prerequisites.html

[Dinuka de Silva]

Hi Dinuka

On Tue, 9 Jun 2020, 01:11 Dinuka Piyadigama, <drpiya...@gmail.com> wrote:

Hi Dinuka,

What I realized is that I need to have a database for an election in order to show the available options in the frontend.

Yes. If you run the create database script, the database gets created for you.

app.config.from_envvar('ENV_CONFIG')

I can't seem to find a place to define the ENV_CONFIG to the env/dev.cfg file.

It's here.

https://github.com/ECLK/results-tabulation/tree/master/results-tabulation-api/env

And you have to execute scripts from

"results-tabulation/tresults-tabulation-api" directory

Can I know where I'm supposed to run the following export statements?

I get the database create/ migrate/ upgrade thing. What's not clear is how I can export those env files. Even in the Docker file, it's just given as,

RUN export ENV_CONFIG=./env/dev.cfg
RUN python manage.py db upgrade; exit 0

This doesn't seem to work in the command line. Is there an OS concern for this?

Not really. If you follow the readme, that's pretty much needed. 

Regards,
Dinuka. 

And please copy only the elections mailing list (lsf-el...@googlegroups.com) not the volunteers mailing list please. 😄

You received this message because you are subscribed to the Google Groups "LSF Volunteer Group" group.
To unsubscribe from this group and stop receiving emails from it, send an email to volunteer+...@opensource.lk.

[Dinuka Piyadigama]

Hi Dinuka,

I finally managed to get the backend database stuff set-up! 😅

Now I get, 

[Error] 1001  
No valid user role found.  

in the frontend application.

The screenshot below shows what's printed in the terminal of backend application.

I used the static user 'dinuka' as you mentioned that it can be used in a previous email.
I did just uncomment the X-Jwt-Assertion in [1].

Is it necessary to invoke the POST /election and stuff as well as mentioned in the readme [2] for this to work? Or is there anything else that I'm missing?

And if I try to run the local server in the browser using https://localhost:5000/ui/  it sort of breaks the PyCharm console. The font gets messed up. I have to close the project and reopen it to get things back to normal.

Can I know how to proceed from here onwards?

Regards,
Dinuka.

[Dinuka Piyadigama]

Hi Dinuka,

I finally managed to get the backend database stuff set-up! 😅

Now I get, 

[Error] 1001  
No valid user role found.  

in the frontend application.

The screenshot below shows what's printed in the terminal of backend application.

I used the static user 'dinuka' as you mentioned that it can be used in a previous email.
I did just uncomment the X-Jwt-Assertion in [1].

Is it necessary to invoke the POST /election and stuff as well as mentioned in the readme [2] for this to work? Or is there anything else that I'm missing?

And if I try to run the local server in the browser using https://localhost:5000/ui/  it sort of breaks the PyCharm console. The font gets messed up. I have to close the project and reopen it to get things back to normal.

Can I know how to proceed from here onwards?

References:

[1]https://github.com/ECLK/results-tabulation/blob/master/results-tabulation-ui/src/services/tabulation-api/index.js#L34

[2]https://github.com/ECLK/results-tabulation/blob/master/results-tabulation-api/readme.md  

Regards,
Dinuka.

[Dinuka Piyadigama]

Hi Dinuka,

Happy to let you know that I managed to get the project up and running! Thank you for guiding me through the setup process.

I'll update the documentation with the project setting-up instructions for Windows for a start.

I feel like I can help a lot with improving the frontend here. It'll be good if I can be given any instructions or mock-ups of any requirements. I'll get started with working on tasks that address issues of the project mentioned on GitHub.

Eager to start contributing here! 😄

The tests in the backend printed some errors though. I'm guessing that you're aware of that already.

Regards,

Dinuka.

[Dinuka de Silva]

Hi Dinuka,

Glad you are on track. I have created an issue for you to work on adding setting up instructions for windows [8].

You may wanna review contributing guidelines here [7].

On Tue, Jun 16, 2020 at 1:18 AM Dinuka Piyadigama <drpiya...@gmail.com> wrote:

Hi Dinuka,

Happy to let you know that I managed to get the project up and running! Thank you for guiding me through the setup process.

I'll update the documentation with the project setting-up instructions for Windows for a start.

I feel like I can help a lot with improving the frontend here.

Indeed. Once you are done with your first contribution, let's discuss more.

 

It'll be good if I can be given any instructions or mock-ups of any requirements. I'll get started with working on tasks that address issues of the project mentioned on GitHub.

Eager to start contributing here! 😄

The tests in the backend printed some errors though. I'm guessing that you're aware of that already.

The test's not updated recently and it should be not working. :) 

[7] https://eclk.github.io/results-tabulation/docs/CONTRIBUTE.html 

[8] https://github.com/ECLK/results-tabulation/issues/639