webiny / webiny-js

Open-source serverless enterprise CMS. Includes a headless CMS, page builder, form builder, and file manager. Easy to customize and expand. Deploys to AWS.
https://www.webiny.com
Other
7.3k stars 602 forks source link

fix: style "not authorized" admin view #423

Closed adrians5j closed 3 years ago

adrians5j commented 5 years ago

snip20190105_3

daniloff200 commented 3 years ago

Well, I should ask, in what it should be fixed? Centered, font-size change, any other ideas?

Ashu96 commented 3 years ago

Hey @daniloff200 Welcome! Here are some links to get you started: Some instructions about contributing: https://github.com/webiny/webiny-js/blob/master/docs/CONTRIBUTING.md Our YouTube channel with different videos about the project, how stuff works, etc: https://www.youtube.com/c/Webiny/videos

Regarding this issue:

We're looking for something similar to this one:

image

Here is the code responsible for rendering the Not authorized view: https://github.com/webiny/webiny-js/blob/master/packages/app-security/src/admin/plugins/secureRouteError.tsx#L14

We use emotion (CSS-in-JS) for writing style. For example, https://github.com/webiny/webiny-js/blob/master/packages/app-mailchimp/src/admin/components/MailchimpElementAdvancedSettings.tsx#L24

Here is the asset used in the sample screenshot: https://drive.google.com/file/d/1T_BgtSyX5pwm7HHdpElTmZ-w6GA4vkXo/view?usp=sharing

If you have any other questions, please do leave a comment or reach out via Slack it will be a lot quicker :) Cheers!

aloks98 commented 3 years ago

Hey, how I do reach the not authorized page? I have made some changes but cannot figure out how to reach the page.

Ashu96 commented 3 years ago

Hey @aloks98, This view is rendered by SecureRoute component, which is used throughout the admin app and other Webiny apps to secure the route from unauthorized access as the name suggest.

For example, https://github.com/webiny/webiny-js/blob/master/packages/app-page-builder/src/admin/plugins/routes.tsx#L52 Here if the user doesn't have the required scope "pb:menu:crud" code reference, this component will render the no access view.

Whenever a user without the required scope visits the route, he will get this error page/view.