Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 9c7746f

Browse files
kylecarbskylecarbs
authored
Merge branch 'main' into createproject
2 parents a8d00d8 + df13fef commit 9c7746f

File tree

17 files changed

+216
-32
lines changed

17 files changed

+216
-32
lines changed

‎Makefile

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
INSTALL_DIR=$(shell go env GOPATH)/bin
2+
13
bin/coder:
24
mkdir -p bin
35
go build -o bin/coder cmd/coder/main.go
@@ -51,6 +53,12 @@ fmt: fmt/prettier fmt/sql
5153
gen: database/generate peerbroker/proto provisionersdk/proto provisionerd/proto
5254
.PHONY: gen
5355

56+
install:
57+
@echo "--- Copying from bin to $(INSTALL_DIR)"
58+
cp -r ./bin $(INSTALL_DIR)
59+
@echo "-- CLI available at $(shell ls $(INSTALL_DIR)/coder*)"
60+
.PHONY: install
61+
5462
peerbroker/proto: peerbroker/proto/peerbroker.proto
5563
protoc \
5664
--go_out=. \

‎README.md

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,13 @@ This repository contains source code for Coder V2. Additional documentation:
1515

1616
## Development
1717

18+
### Pre-requisites
19+
20+
- `git`
21+
- `go` version 1.17, with the `GOPATH` environment variable set
22+
- `node`
23+
- `yarn`
24+
1825
### Cloning
1926

2027
- `git clone https://github.com/coder/coder`
@@ -23,6 +30,9 @@ This repository contains source code for Coder V2. Additional documentation:
2330
### Building
2431

2532
- `make build`
33+
- `make install`
34+
35+
The `coder` CLI binary will now be available at `$GOPATH/bin/coder`
2636

2737
### Development
2838

‎site/.eslintrc.yaml

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -92,8 +92,6 @@ rules:
9292
message:
9393
"Use path imports to avoid pulling in unused modules. See:
9494
https://material-ui.com/guides/minimizing-bundle-size/"
95-
- name: "@material-ui/core/Tooltip"
96-
message: "Use the custom Tooltip on componens/Tooltip"
9795
no-storage/no-browser-storage: error
9896
no-unused-vars: "off"
9997
"object-curly-spacing": "off"

‎site/components/Button/CopyButton.tsx

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
import { makeStyles } from "@material-ui/core/styles"
2+
import Button from "@material-ui/core/Button"
3+
import Tooltip from "@material-ui/core/Tooltip"
4+
import Check from "@material-ui/icons/Check"
5+
import React, { useState } from "react"
6+
import { FileCopy } from "../Icons"
7+
8+
interface CopyButtonProps {
9+
text: string
10+
className?: string
11+
}
12+
13+
/**
14+
* Copy button used inside the CodeBlock component internally
15+
*/
16+
export const CopyButton: React.FC<CopyButtonProps> = ({ className = "", text }) => {
17+
const styles = useStyles()
18+
const [isCopied, setIsCopied] = useState<boolean>(false)
19+
20+
const copyToClipboard = async (): Promise<void> => {
21+
try {
22+
await window.navigator.clipboard.writeText(text)
23+
setIsCopied(true)
24+
25+
window.setTimeout(() => {
26+
setIsCopied(false)
27+
}, 1000)
28+
} catch (err) {
29+
const wrappedErr = new Error("copyToClipboard: failed to copy text to clipboard")
30+
if (err instanceof Error) {
31+
wrappedErr.stack = err.stack
32+
}
33+
console.error(wrappedErr)
34+
}
35+
}
36+
37+
return (
38+
<Tooltip title="Copy to Clipboard" placement="top">
39+
<div className={`${styles.copyButtonWrapper} ${className}`}>
40+
<Button className={styles.copyButton} onClick={copyToClipboard} size="small">
41+
{isCopied ? <Check className={styles.fileCopyIcon} /> : <FileCopy className={styles.fileCopyIcon} />}
42+
</Button>
43+
</div>
44+
</Tooltip>
45+
)
46+
}
47+
48+
const useStyles = makeStyles((theme) => ({
49+
copyButtonWrapper: {
50+
display: "flex",
51+
marginLeft: theme.spacing(1),
52+
},
53+
copyButton: {
54+
borderRadius: 7,
55+
background: theme.palette.codeBlock.button.main,
56+
color: theme.palette.codeBlock.button.contrastText,
57+
padding: theme.spacing(0.85),
58+
minWidth: 32,
59+
60+
"&:hover": {
61+
background: theme.palette.codeBlock.button.hover,
62+
},
63+
},
64+
fileCopyIcon: {
65+
width: 20,
66+
height: 20,
67+
},
68+
}))

‎site/components/Button/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,3 @@
11
export * from "./SplitButton"
22
export * from "./LoadingButton"
3+
export * from "./CopyButton"

‎site/components/CodeBlock/index.stories.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export default {
1212
title: "CodeBlock",
1313
component: CodeBlock,
1414
argTypes: {
15-
lines: { control: "object", defaultValue: sampleLines },
15+
lines: { control: "text", defaultValue: sampleLines },
1616
},
1717
}
1818

‎site/components/CodeBlock/index.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { makeStyles } from "@material-ui/core/styles"
22
import React from "react"
3+
import { MONOSPACE_FONT_FAMILY } from "../../theme/constants"
34

45
export interface CodeBlockProps {
56
lines: string[]
@@ -18,8 +19,6 @@ export const CodeBlock: React.FC<CodeBlockProps> = ({ lines }) => {
1819
</div>
1920
)
2021
}
21-
const MONOSPACE_FONT_FAMILY =
22-
"'Fira Code', 'Lucida Console', 'Lucida Sans Typewriter', 'Liberation Mono', 'Monaco', 'Courier New', Courier, monospace"
2322

2423
const useStyles = makeStyles((theme) => ({
2524
root: {

‎site/components/CodeExample/CodeExample.stories.tsx

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { Story } from "@storybook/react"
2+
import React from "react"
3+
import { CodeExample, CodeExampleProps } from "./CodeExample"
4+
5+
const sampleCode = `echo "Hello, world"`
6+
7+
export default {
8+
title: "CodeExample",
9+
component: CodeExample,
10+
argTypes: {
11+
code: { control: "string", defaultValue: sampleCode },
12+
},
13+
}
14+
15+
const Template: Story<CodeExampleProps> = (args: CodeExampleProps) => <CodeExample {...args} />
16+
17+
export const Example = Template.bind({})
18+
Example.args = {
19+
code: sampleCode,
20+
}

‎site/components/CodeExample/CodeExample.test.tsx

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { screen } from "@testing-library/react"
2+
import { render } from "../../test_helpers"
3+
import React from "react"
4+
import { CodeExample } from "./CodeExample"
5+
6+
describe("CodeExample", () => {
7+
it("renders code", async () => {
8+
// When
9+
render(<CodeExample code="echo hello" />)
10+
11+
// Then
12+
// Both lines should be rendered
13+
await screen.findByText("echo hello")
14+
})
15+
})

‎site/components/CodeExample/CodeExample.tsx

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
import { makeStyles } from "@material-ui/core/styles"
2+
import React from "react"
3+
import { MONOSPACE_FONT_FAMILY } from "../../theme/constants"
4+
5+
import { CopyButton } from "../Button"
6+
7+
export interface CodeExampleProps {
8+
code: string
9+
}
10+
11+
/**
12+
* Component to show single-line code examples, with a copy button
13+
*/
14+
export const CodeExample: React.FC<CodeExampleProps> = ({ code }) => {
15+
const styles = useStyles()
16+
17+
return (
18+
<div className={styles.root}>
19+
<code>{code}</code>
20+
<CopyButton text={code} />
21+
</div>
22+
)
23+
}
24+
25+
const useStyles = makeStyles((theme) => ({
26+
root: {
27+
display: "flex",
28+
flexDirection: "row",
29+
justifyContent: "space-between",
30+
alignItems: "center",
31+
background: theme.palette.background.default,
32+
color: theme.palette.codeBlock.contrastText,
33+
fontFamily: MONOSPACE_FONT_FAMILY,
34+
fontSize: 13,
35+
padding: theme.spacing(2),
36+
borderRadius: theme.shape.borderRadius,
37+
},
38+
}))

0 commit comments

Comments
 (0)