This repository has been archived by the owner on Aug 22, 2022. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 22
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[BB-3618] Implement page structure (#714)
* Added the initial implementation of the new page structure This commit adds the initial implementation of page structure where we are trying to revamp the UI. Signed-off-by: Farhaan Bukhsh <farhaan@opencraft.com>
- Loading branch information
1 parent
c1183fe
commit edcb1fa
Showing
32 changed files
with
2,477 additions
and
77 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
8 changes: 8 additions & 0 deletions
8
frontend/src/newConsole/components/PreviewBox/PreviewBox.spec.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,8 @@ | ||
| import React from 'react'; | ||
| import { setupComponentForTesting } from "utils/testing"; | ||
| import { PreviewBox } from './PreviewBox'; | ||
|
|
||
| it('renders without crashing', () => { | ||
| const tree = setupComponentForTesting(<PreviewBox />).toJSON(); | ||
| expect(tree).toMatchSnapshot(); | ||
| }); |
13 changes: 13 additions & 0 deletions
13
frontend/src/newConsole/components/PreviewBox/PreviewBox.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| import * as React from 'react'; | ||
| import { Card } from 'react-bootstrap'; | ||
| import './style.scss'; | ||
|
|
||
| interface PreviewBoxProps { | ||
| children?: React.ReactNode; | ||
| } | ||
|
|
||
| export const PreviewBox: React.FC<PreviewBoxProps> = ( | ||
| props: PreviewBoxProps | ||
| ) => { | ||
| return <Card className="preview-box">{props.children}</Card>; | ||
| }; |
7 changes: 7 additions & 0 deletions
7
frontend/src/newConsole/components/PreviewBox/__snapshots__/PreviewBox.spec.tsx.snap
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| // Jest Snapshot v1, https://goo.gl/fbAQLP | ||
|
|
||
| exports[`renders without crashing 1`] = ` | ||
| <div | ||
| className="preview-box card" | ||
| /> | ||
| `; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| export * from './PreviewBox'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,5 @@ | ||
| .preview-box { | ||
| height: 100%; | ||
| box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.3); | ||
| width: 95%; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,4 @@ | ||
| export * from './newConsolePage'; | ||
| export * from './newCustomizationSideMenu'; | ||
| export * from './newLogos'; | ||
| export * from './PreviewBox'; |
106 changes: 106 additions & 0 deletions
106
frontend/src/newConsole/components/newConsolePage/ConsolePage.spec.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,106 @@ | ||
| import React from 'react'; | ||
| import { setupComponentForTesting } from "utils/testing"; | ||
| import { ConsolePage } from './ConsolePage'; | ||
|
|
||
|
|
||
| describe("Console Page", function() { | ||
| it('Correctly renders loading page', () => { | ||
| const tree = setupComponentForTesting( | ||
| <ConsolePage contentLoading={true} showSideBarEditComponent={false}> | ||
| <span> Test! </span> | ||
| </ConsolePage>, | ||
| { | ||
| console: { | ||
| loading: true | ||
| } | ||
| } | ||
| ).toJSON(); | ||
| expect(tree).toMatchSnapshot(); | ||
| }); | ||
|
|
||
| describe("Console Page with Edit component", function() { | ||
| it('Correctly renders loading page', () => { | ||
| const tree = setupComponentForTesting( | ||
| <ConsolePage contentLoading={true} showSideBarEditComponent={true}> | ||
| <span> Test! </span> | ||
| </ConsolePage>, | ||
| { | ||
| console: { | ||
| loading: true | ||
| } | ||
| } | ||
| ).toJSON(); | ||
| expect(tree).toMatchSnapshot(); | ||
| }); | ||
| }); | ||
|
|
||
| it('Correctly renders page with data', () => { | ||
| const tree = setupComponentForTesting( | ||
| <ConsolePage contentLoading={false} showSideBarEditComponent={false}> | ||
| <span> Test! </span> | ||
| </ConsolePage>, | ||
| { | ||
| console: { | ||
| loading: false, | ||
| activeInstance: { | ||
| data: { | ||
| id: 1, | ||
| instanceName: "test", | ||
| subdomain: "test", | ||
| lmsUrl: "test-url", | ||
| studioUrl: "test-url", | ||
| isEmailVerified: true, | ||
| }, | ||
| deployment: { | ||
| status: "preparing", | ||
| undeployedChanges: [], | ||
| deployedChanges: null, | ||
| type: 'admin', | ||
| } | ||
| }, | ||
| instances: [{ | ||
| id: 1, | ||
| instanceName: "test", | ||
| subdomain: "test", | ||
| }] | ||
| } | ||
| } | ||
| ).toJSON(); | ||
| expect(tree).toMatchSnapshot(); | ||
| }); | ||
|
|
||
| it('Correctly renders page with email not verified alert', () => { | ||
| const tree = setupComponentForTesting( | ||
| <ConsolePage contentLoading={false} showSideBarEditComponent={false}> | ||
| <span> Test! </span> | ||
| </ConsolePage>, | ||
| { | ||
| console: { | ||
| loading: false, | ||
| activeInstance: { | ||
| data: { | ||
| id: 1, | ||
| instanceName: "test", | ||
| subdomain: "test", | ||
| lmsUrl: "test-url", | ||
| studioUrl: "test-url", | ||
| isEmailVerified: false, | ||
| }, | ||
| deployment: { | ||
| status: "preparing", | ||
| undeployedChanges: [], | ||
| deployedChanges: null, | ||
| type: 'admin', | ||
| } | ||
| }, | ||
| instances: [{ | ||
| id: 1, | ||
| instanceName: "test", | ||
| subdomain: "test", | ||
| }] | ||
| } | ||
| } | ||
| ).toJSON(); | ||
| expect(tree).toMatchSnapshot(); | ||
| }); | ||
| }); |
Oops, something went wrong.