Skip to content

Commit d95b325

Browse files
CompuIvesCompuIves
authored
Merge branch 'master' into improve/esmodules
2 parents a0dae47 + 905cc7a commit d95b325

File tree

44 files changed

+1269
-206
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

44 files changed

+1269
-206
lines changed

‎.drone.yml‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ steps:
2626
- yarn build
2727

2828
- name: deploy
29-
image: lbogdan/codesandbox-deploy-plugin:3
29+
image: lbogdan/codesandbox-deploy-plugin:4
3030
settings:
3131
domain: &domain build.csb.dev
3232
volumes:
@@ -124,7 +124,7 @@ steps:
124124
- yarn build
125125

126126
- name: deploy
127-
image: lbogdan/codesandbox-deploy-plugin:2
127+
image: lbogdan/codesandbox-deploy-plugin:4
128128
settings:
129129
domain: &domain build.csb.dev
130130
volumes:
@@ -177,6 +177,6 @@ trigger:
177177
branch: master
178178
---
179179
kind: signature
180-
hmac: e625eaf2e469b9b6763641d4cc1f089900ef8d8c41db32c6f6aacb27bee8c19c
180+
hmac: a229340365980b689bbe4c5f92d721cf3b6ce176670293a925f329501a054fe4
181181

182182
...

‎.vscode/settings.json‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,5 +6,9 @@
66
"javascriptreact",
77
{ "language": "typescript", "autoFix": true },
88
{ "language": "typescriptreact", "autoFix": true }
9-
]
9+
],
10+
"files.watcherExclude": {
11+
"**/node_modules": true,
12+
"**/node_modules/**": false
13+
}
1014
}

‎packages/app/package.json‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -161,9 +161,9 @@
161161
"normalizr": "^3.2.3",
162162
"onigasm": "^2.2.1",
163163
"ot": "^0.0.15",
164-
"overmind": "^21.0.0-1576231149763",
164+
"overmind": "^22.0.0-1579617484651",
165165
"overmind-devtools": "^19.0.0",
166-
"overmind-react": "^22.0.0-1576231149763",
166+
"overmind-react": "^23.0.0-1579617484651",
167167
"phoenix": "^1.4.11",
168168
"postcss": "^6.0.9",
169169
"postcss-selector-parser": "^2.2.3",
@@ -217,6 +217,7 @@
217217
"subworkers": "^1.0.1",
218218
"svg-react-loader": "^0.4.4",
219219
"tern": "^0.21.0",
220+
"use-interval": "^1.2.1",
220221
"util": "0.11.1",
221222
"vue": "^2.5.2",
222223
"vue-eslint-parser": "^2.0.3",

‎packages/app/src/app/overmind/effects/vscode/initializers.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -124,7 +124,7 @@ export function initializeCustomTheme() {
124124

125125
installCustomTheme(
126126
'codesandbox-black-0.0.1',
127-
'CodeSandbox Black',
127+
'CodeSandbox Black.',
128128
JSON.stringify(codeSandboxBlackTheme)
129129
);
130130
}

‎packages/app/src/app/pages/Sandbox/Editor/Workspace/index.tsx‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,10 +21,12 @@ import { Deployment } from './items/Deployment';
2121
import { FilesItem } from './items/Files';
2222
import { GitHub } from './items/GitHub';
2323
import { Live } from './items/Live';
24+
import { Live as LiveNew } from './screens/Live';
2425
import { More } from './items/More';
2526
import { NotOwnedSandboxInfo } from './items/NotOwnedSandboxInfo';
2627
import { ProjectInfo } from './items/ProjectInfo';
2728
import { ProjectInfo as ProjectInfoNew } from './screens/ProjectInfo';
29+
import { Deployment as DeploymentNew } from './screens/Deployment/index';
2830

2931
import { Server } from './items/Server';
3032
import { SSEDownNotice } from './SSEDownNotice';
@@ -37,9 +39,9 @@ const workspaceTabs = {
3739
'project-summary': NotOwnedSandboxInfo,
3840
files: FilesItem,
3941
github: GitHub,
40-
deploy: Deployment,
42+
deploy: REDESIGNED_SIDEBAR ? DeploymentNew : Deployment,
4143
config: REDESIGNED_SIDEBAR ? ConfigurationFilesNew : ConfigurationFiles,
42-
live: Live,
44+
live: REDESIGNED_SIDEBAR ? LiveNew : Live,
4345
server: Server,
4446
more: More,
4547
};

‎packages/app/src/app/pages/Sandbox/Editor/Workspace/screens/Deployment/Netlify.tsx‎

Lines changed: 113 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,113 @@
1+
import React, { useEffect } from 'react';
2+
import getTemplate from '@codesandbox/common/lib/templates';
3+
import track from '@codesandbox/common/lib/utils/analytics';
4+
import { useOvermind } from 'app/overmind';
5+
6+
import {
7+
Element,
8+
ListAction,
9+
Text,
10+
Stack,
11+
List,
12+
ListItem,
13+
Button,
14+
Integration,
15+
} from '@codesandbox/components';
16+
import { css } from '@styled-system/css';
17+
import { NetlifyIcon, FileIcon, VisitIcon, FlagIcon } from './icons';
18+
19+
export const Netlify = () => {
20+
const {
21+
actions: {
22+
modalOpened,
23+
deployment: { deployWithNetlify, getNetlifyDeploys },
24+
},
25+
state: {
26+
deployment: {
27+
deploying,
28+
netlifySite,
29+
building,
30+
netlifyLogs,
31+
netlifyClaimUrl,
32+
},
33+
editor: { currentSandbox },
34+
},
35+
} = useOvermind();
36+
37+
useEffect(() => {
38+
getNetlifyDeploys();
39+
}, [getNetlifyDeploys]);
40+
41+
const template = getTemplate(currentSandbox.template);
42+
43+
return (
44+
template.netlify !== false && (
45+
<>
46+
<Integration icon={NetlifyIcon} title="netlify">
47+
<Stack direction="vertical">
48+
<Text variant="muted">Enables</Text>
49+
<Text>Deployments</Text>
50+
</Stack>
51+
<Button
52+
disabled={deploying || building}
53+
onClick={() => {
54+
track('Deploy Clicked', { provider: 'netlify' });
55+
deployWithNetlify();
56+
}}
57+
>
58+
Deploy
59+
</Button>
60+
<Element
61+
css={css({
62+
gridColumnStart: 1,
63+
gridColumnEnd: 3,
64+
})}
65+
>
66+
{netlifySite ? (
67+
<List>
68+
<ListItem>
69+
<Text weight="bold">{netlifySite.name}</Text>
70+
</ListItem>
71+
{building && !netlifyLogs && (
72+
<ListItem>
73+
<Text variant="muted">Building</Text>
74+
</ListItem>
75+
)}
76+
{netlifySite.url ? (
77+
<ListAction
78+
onClick={() => window.open(netlifySite.url, '_blank')}
79+
>
80+
<Element marginRight={2}>
81+
<VisitIcon />
82+
</Element>{' '}
83+
Visit Site
84+
</ListAction>
85+
) : null}
86+
{netlifySite.url ? (
87+
<ListAction
88+
onClick={() => window.open(netlifyClaimUrl, '_blank')}
89+
>
90+
<Element marginRight={2}>
91+
<FlagIcon />
92+
</Element>{' '}
93+
Claim Site
94+
</ListAction>
95+
) : null}
96+
{netlifyLogs ? (
97+
<ListAction
98+
onClick={() => modalOpened({ modal: 'netlifyLogs' })}
99+
>
100+
<Element marginRight={2}>
101+
<FileIcon />
102+
</Element>{' '}
103+
View Logs
104+
</ListAction>
105+
) : null}
106+
</List>
107+
) : null}
108+
</Element>
109+
</Integration>
110+
</>
111+
)
112+
);
113+
};

‎packages/app/src/app/pages/Sandbox/Editor/Workspace/screens/Deployment/Zeit.tsx‎

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
import React from 'react';
2+
import {
3+
Element,
4+
Text,
5+
Stack,
6+
Button,
7+
Integration,
8+
ListAction,
9+
ListItem,
10+
List,
11+
} from '@codesandbox/components';
12+
import distanceInWordsToNow from 'date-fns/distance_in_words_to_now';
13+
import { css } from '@styled-system/css';
14+
import { useOvermind } from 'app/overmind';
15+
import { ZeitIcon, VisitIcon, TrashIcon } from './icons';
16+
import { State } from './elements';
17+
18+
export const Zeit = () => {
19+
const {
20+
actions: { modalOpened, deployment },
21+
state: {
22+
deployment: { deploying, sandboxDeploys, deploysBeingDeleted },
23+
user: { integrations },
24+
},
25+
} = useOvermind();
26+
const { deploySandboxClicked, setDeploymentToDelete } = deployment;
27+
return (
28+
<Element marginTop={5}>
29+
<Integration icon={ZeitIcon} title="ZEIT">
30+
<Stack direction="vertical">
31+
<Text variant="muted">Enables</Text>
32+
<Text>Deployments</Text>
33+
</Stack>
34+
<Button disabled={deploying} onClick={deploySandboxClicked}>
35+
{integrations.zeit ? 'Deploy' : 'Sign In'}
36+
</Button>
37+
<Element
38+
css={css({
39+
gridColumnStart: 1,
40+
gridColumnEnd: 3,
41+
})}
42+
>
43+
{sandboxDeploys &&
44+
sandboxDeploys.map(deploy => {
45+
const disabled = deploysBeingDeleted
46+
? deploysBeingDeleted.includes(deploy.uid)
47+
: deployment[`${deploy.uid}Deleting`];
48+
return (
49+
<List key={deploy.uid}>
50+
<ListItem>
51+
<Text weight="bold">{deploy.name}</Text>
52+
</ListItem>
53+
<ListItem>
54+
<State state={deploy.state}>
55+
{deploy.state.toString().toLowerCase()}
56+
</State>
57+
<Text variant="muted" marginLeft={2}>
58+
{`(${distanceInWordsToNow(deploy.created)} ago)`}
59+
</Text>
60+
</ListItem>
61+
<ListAction
62+
onClick={() =>
63+
window.open(`https://${deploy.url}`, '_blank')
64+
}
65+
>
66+
<Element marginRight={2}>
67+
<VisitIcon />
68+
</Element>{' '}
69+
Visit Site
70+
</ListAction>
71+
<ListAction
72+
disabled={disabled}
73+
onClick={() => {
74+
setDeploymentToDelete({ id: deploy.uid });
75+
modalOpened({ modal: 'deleteDeployment' });
76+
}}
77+
>
78+
<Element marginRight={2}>
79+
<TrashIcon />
80+
</Element>{' '}
81+
Delete
82+
</ListAction>
83+
</List>
84+
);
85+
})}
86+
</Element>
87+
</Integration>
88+
</Element>
89+
);
90+
};

‎packages/app/src/app/pages/Sandbox/Editor/Workspace/screens/Deployment/elements.ts‎

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
import { ZeitDeploymentState } from '@codesandbox/common/lib/types';
2+
import styled, { css } from 'styled-components';
3+
import { Text } from '@codesandbox/components';
4+
5+
const mapColorToState = (state: ZeitDeploymentState, theme: any) => {
6+
const STARTING = [
7+
ZeitDeploymentState.BUILDING,
8+
ZeitDeploymentState.DEPLOYING,
9+
ZeitDeploymentState.INITIALIZING,
10+
];
11+
const ERROR = [
12+
ZeitDeploymentState.BUILD_ERROR,
13+
ZeitDeploymentState.DEPLOYMENT_ERROR,
14+
ZeitDeploymentState.ERROR,
15+
];
16+
const STARTED = [ZeitDeploymentState.BOOTED, ZeitDeploymentState.READY];
17+
18+
if (STARTING.includes(state)) {
19+
return '#FCCB7E';
20+
}
21+
if (ERROR.includes(state)) {
22+
return theme.red;
23+
}
24+
if (STARTED.includes(state)) {
25+
return theme.green;
26+
}
27+
if (state === ZeitDeploymentState.FROZEN) {
28+
return theme.blue;
29+
}
30+
31+
return theme.gray;
32+
};
33+
34+
export const State = styled(Text)<{ state: ZeitDeploymentState }>`
35+
${({ state, theme }) => css`
36+
display: flex;
37+
align-items: center;
38+
text-transform: capitalize;
39+
&:before {
40+
content: '';
41+
display: block;
42+
width: 10px;
43+
height: 10px;
44+
border-radius: 50%;
45+
margin-right: 0.5rem;
46+
background: ${mapColorToState(state, theme)};
47+
}
48+
`};
49+
`;

0 commit comments

Comments
 (0)