8000 create provider, fix styles for storybook · dcmade01/coderoad-vscode@e370e9b · GitHub
[go: up one dir, main page]
Skip to content

Commit e370e9b

Browse files
ShMcKShMcK
committed
create provider, fix styles for storybook
Signed-off-by: shmck <shawn.j.mckay@gmail.com>
1 parent a2a1857 commit e370e9b

File tree

9 files changed

+71
-78
lines changed
  • Tutorial
  • environment.ts
  • stories/utils

    • 9 files changed

    +71
    -78
    lines changed

    ‎web-app/src/App.tsx

    Lines changed: 4 additions & 16 deletions
    Original file line numberDiff line numberDiff line change
    @@ -1,23 +1,11 @@
    11
    import * as React from 'react'
    2-
    import { ConfigProvider } from '@alifd/next'
    3-
    import enUS from '@alifd/next/lib/locale/en-us'
    4-
    import ErrorBoundary from './components/ErrorBoundary'
    5-
    import Workspace from './components/Workspace'
    6-
    import { ThemeProvider } from 'emotion-theming'
    7-
    import theme from './styles/theme'
    2+
    import Provider from './Provider'
    83
    import Routes from './Routes'
    94

    105
    const App = () => (
    11-
    /* @ts-ignore invalid in enUS locale typings for @alifd/next@1.20.20 https://github.com/alibaba-fusion/next/commit/e3b934b */
    12-
    <ConfigProvider locale={enUS}>
    13-
    <Workspace>
    14-
    <ErrorBoundary>
    15-
    <ThemeProvider theme={theme}>
    16-
    <Routes />
    17-
    </ThemeProvider>
    18-
    </ErrorBoundary>
    19-
    </Workspace>
    20-
    </ConfigProvider>
    6+
    <Provider>
    7+
    <Routes />
    8+
    </Provider>
    219
    )
    2210

    2311
    export default App

    ‎web-app/src/Provider.tsx

    Lines changed: 40 additions & 0 deletions
    Original file line numberDiff line numberDiff line change
    @@ -0,0 +1,40 @@
    1+
    import * as React from 'react'
    2+
    import { css, jsx } from '@emotion/core'
    3+
    import { ConfigProvider } from '@alifd/next'
    4+
    import enUS from '@alifd/next/lib/locale/en-us'
    5+
    import ErrorBoundary from './components/ErrorBoundary'
    6+
    import { ThemeProvider } from 'emotion-theming'
    7+
    import { AdminProvider } from './services/admin/context'
    8+
    import theme, { Theme } from './styles/theme'
    9+
    10+
    type Props = {
    11+
    children: React.ReactElement
    12+
    }
    13+
    14+
    const styles = {
    15+
    page: (theme: Theme) => ({
    16+
    display: 'flex' as 'flex',
    17+
    position: 'relative' as 'relative',
    18+
    margin: 0,
    19+
    width: '100vw',
    20+
    maxWidth: '100%',
    21+
    minHeight: '100vh',
    22+
    backgroundColor: theme['$color-white'],
    23+
    overflow: 'auto',
    24+
    }),
    25+
    }
    26+
    27+
    const Provider = (props: Props) => (
    28+
    /* @ts-ignore invalid in enUS locale typings for @alifd/next@1.20.20 https://github.com/alibaba-fusion/next/commit/e3b934b */
    29+
    <ConfigProvider locale={enUS}>
    30+
    <div css={styles.page}>
    31+
    <AdminProvider>
    32+
    <ErrorBoundary>
    33+
    <ThemeProvider theme={theme}>{props.children}</ThemeProvider>
    34+
    </ErrorBoundary>
    35+
    </AdminProvider>
    36+
    </div>
    37+
    </ConfigProvider>
    38+
    )
    39+
    40+
    export default Provider

    ‎web-app/src/components/Workspace/index.tsx

    Lines changed: 0 additions & 25 deletions
    This file was deleted.

    ‎web-app/src/containers/Loading/index.tsx

    Lines changed: 6 additions & 4 deletions
    Original file line numberDiff line numberDiff line change
    @@ -11,17 +11,19 @@ interface Props {
    1111

    1212
    const styles = {
    1313
    page: {
    14-
    position: 'relative' as 'relative',
    1514
    display: 'flex' as 'flex',
    1615
    flexDirection: 'column' as 'column',
    1716
    alignItems: 'center' as 'center',
    1817
    justifyContent: 'center' as 'center',
    19-
    height: '100vh',
    20-
    width: '100vw',
    18+
    position: 'absolute' as 'absolute',
    19+
    top: 0,
    20+
    bottom: 0,
    21+
    left: 0,
    22+
    right: 0,
    2123
    },
    2224
    processes: {
    2325
    padding: '0 1rem',
    24-
    position: 'fixed' as 'fixed',
    26+
    position: 'absolute' as 'absolute',
    2527
    bottom: 0,
    2628
    left: 0,
    2729
    right: 0,

    ‎web-app/src/containers/SelectTutorial/TutorialOverview/index.tsx

    Lines changed: 1 addition & 1 deletion
    Original file line numberDiff line numberDiff line change
    @@ -45,7 +45,7 @@ const styles = {
    4545
    paddingLeft: '1.1rem',
    4646
    },
    4747
    footer: (theme: Theme) => ({
    48-
    position: 'fixed' as 'fixed',
    48+
    position: 'absolute' as 'absolute',
    4949
    bottom: 0,
    5050
    left: 0,
    5151
    right: 0,

    ‎web-app/src/containers/Tutorial/index.tsx

    Lines changed: 3 additions & 3 deletions
    Original file line numberDiff line numberDiff line change
    @@ -56,23 +56,23 @@ const styles = {
    5656
    fontSize: '1rem',
    5757
    lineHeight: '1rem',
    5858
    padding: '10px 0rem',
    59-
    position: 'fixed' as 'fixed',
    59+
    position: 'absolute' as 'absolute',
    6060
    bottom: 0,
    6161
    left: 0,
    6262
    right: 0,
    6363
    color: theme['$color-white'],
    6464
    zIndex: 1000,
    6565
    }),
    6666
    completeFooter: {
    67-
    position: 'fixed' as 'fixed',
    67+
    position: 'absolute' as 'absolute',
    6868
    bottom: 0,
    6969
    left: 0,
    7070
    right: 0,
    7171
    zIndex: 1000,
    7272
    },
    7373
    processes: (theme: Theme) => ({
    7474
    padding: '0 1rem',
    75-
    position: 'fixed' as 'fixed',
    75+
    position: 'absolute' as 'absolute',
    7676
    bottom: theme['$footer-height'],
    7777
    left: 0,
    7878
    right: 0,

    ‎web-app/src/environment.ts

    Lines changed: 3 additions & 0 deletions
    Original file line numberDiff line numberDiff line change
    @@ -14,3 +14,6 @@ export const TUTORIAL_LIST_URL: string = process.env.REACT_APP_TUTORIAL_LIST_URL
    1414

    1515
    // config variables
    1616
    export const DISPLAY_RUN_TEST_BUTTON = (process.env.CODEROAD_DISPLAY_RUN_TEST_BUTTON || 'true').toLowerCase() === 'true'
    17+
    18+
    export const ADMIN_MODE = true
    19+
    // (process.env.CODEROAD_ADMIN_MODE || process.env.STORYBOOK_ADMIN_MODE || '').toLowerCase() === 'true'

    ‎web-app/stories/utils/ProviderDecorator.tsx

    Lines changed: 0 additions & 15 deletions
    This file was deleted.

    ‎web-app/stories/utils/SideBarDecorator.tsx

    Lines changed: 14 additions & 14 deletions
    Original file line numberDiff line numberDiff line change
    @@ -1,27 +1,27 @@
    11
    import * as React from 'react'
    22
    import { css, jsx } from '@emotion/core'
    3-
    import { Provider } from './ProviderDecorator'
    4-
    import { ThemeProvider } from 'emotion-theming'
    5-
    import theme from '../../src/styles/theme'
    3+
    import Provider from '../../src/Provider'
    64

    75
    const styles = {
    8-
    container: {
    9-
    left: '25rem',
    10-
    position: 'absolute' as 'absolute',
    11-
    boxSizing: 'border-box' as 'border-box',
    12-
    borderLeft: '2px solid black',
    13-
    borderRight: '2px solid black',
    6+
    limitedWidthContainer: {
    7+
    left: 0,
    8+
    top: 0,
    9+
    position: 'fixed' as 'fixed',
    10+
    borderRight: '1px solid black',
    1411
    width: '50rem',
    15-
    height: window.innerHeight,
    16-
    backgroundColor: 'white',
    12+
    height: '100%',
    13+
    // backgroundColor: 'white',
    14+
    },
    15+
    container: {
    16+
    position: 'relative' as 'relative',
    1717
    },
    1818
    }
    1919

    2020
    const SideBarDecorator = (storyFn) => (
    2121
    <Provider>
    22-
    <ThemeProvider theme={theme}>
    23-
    <div css={styles.container}>{storyFn()}</div>
    24-
    </ThemeProvider>
    22+
    <div css={styles.container}>
    23+
    <div css={styles.limitedWidthContainer}>{storyFn()}</div>
    24+
    </div>
    2525
    </Provider>
    2626
    )
    2727

    0 commit comments

    Comments
     (0)
    0