Skip to content

Commit 5b2ca9b

Browse files
luckolucko
committed
Convert to Vite project
1 parent b31aea5 commit 5b2ca9b

18 files changed

+1179
-9646
lines changed

‎.gitignore‎

Lines changed: 20 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,24 @@
1-
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2-
3-
# dependencies
4-
/node_modules
5-
/.pnp
6-
.pnp.js
7-
8-
# testing
9-
/coverage
10-
11-
# production
12-
/build
13-
14-
# misc
15-
.DS_Store
16-
.env.local
17-
.env.development.local
18-
.env.test.local
19-
.env.production.local
20-
1+
# Logs
2+
logs
3+
*.log
214
npm-debug.log*
225
yarn-debug.log*
236
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
249

25-
.idea
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?

‎Dockerfile‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
# Build stage
2-
FROM node:lts as build
2+
FROM node:lts AS build
33

44
ARG BYTEBIN_URL="data/"
5-
ENV REACT_APP_BYTEBIN_URL="${BYTEBIN_URL}"
5+
ENV VITE_BYTEBIN_URL="${BYTEBIN_URL}"
66

77
WORKDIR /app
88
COPY package.json yarn.lock ./
@@ -13,6 +13,6 @@ RUN yarn build
1313
# Run stage
1414
FROM nginx:alpine
1515
COPY docker/nginx.conf /etc/nginx/conf.d/default.conf
16-
COPY --from=build /app/build /usr/share/nginx/html
16+
COPY --from=build /app/dist /usr/share/nginx/html
1717
CMD ["nginx", "-g", "daemon off;"]
18-
EXPOSE 80/tcp
18+
EXPOSE 80/tcp

‎eslint.config.js‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import js from '@eslint/js'
2+
import globals from 'globals'
3+
import reactHooks from 'eslint-plugin-react-hooks'
4+
import reactRefresh from 'eslint-plugin-react-refresh'
5+
import tseslint from 'typescript-eslint'
6+
7+
export default tseslint.config(
8+
{ ignores: ['dist'] },
9+
{
10+
extends: [js.configs.recommended, ...tseslint.configs.recommended],
11+
files: ['**/*.{ts,tsx}'],
12+
languageOptions: {
13+
ecmaVersion: 2020,
14+
globals: globals.browser,
15+
},
16+
plugins: {
17+
'react-hooks': reactHooks,
18+
'react-refresh': reactRefresh,
19+
},
20+
rules: {
21+
...reactHooks.configs.recommended.rules,
22+
'react-refresh/only-export-components': [
23+
'warn',
24+
{ allowConstantExport: true },
25+
],
26+
},
27+
},
28+
)

public/index.html renamed to index.html

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -11,20 +11,21 @@
1111
<meta name="twitter:card" content="summary" />
1212
<meta name="twitter:title" content="pastes" />
1313
<meta name="twitter:description" content="a simple pastebin." />
14-
<meta name="twitter:image" content="%PUBLIC_URL%/assets/logo256.png" />
14+
<meta name="twitter:image" content="https://pastes.dev/assets/logo256.png" />
1515

1616
<meta property="og:title" content="pastes" />
1717
<meta property="og:description" content="a simple pastebin." />
1818
<meta property="og:type" content="product" />
19-
<meta property="og:image" content="%PUBLIC_URL%/assets/logo256.png" />
20-
<meta property="og:url" content="%PUBLIC_URL%" />
19+
<meta property="og:image" content="https://pastes.dev/assets/logo256.png" />
20+
<meta property="og:url" content="https://pastes.dev" />
2121

22-
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
23-
<link href="%PUBLIC_URL%/assets/logo512.png" rel="shortcut icon" sizes="512x512" type="image/png">
24-
<link rel="apple-touch-icon" href="%PUBLIC_URL%/assets/logo256.png" />
22+
<link rel="icon" href="/favicon.ico" />
23+
<link rel="shortcut icon" href="/assets/logo512.png" sizes="512x512" type="image/png">
24+
<link rel="apple-touch-icon" href="/assets/logo256.png" />
2525
</head>
2626
<body>
2727
<noscript>You need to enable JavaScript to run this app.</noscript>
2828
<div id="root"></div>
29+
<script type="module" src="/src/main.tsx"></script>
2930
</body>
3031
</html>

‎package.json‎

Lines changed: 22 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -2,61 +2,43 @@
22
"name": "paste",
33
"version": "0.1.0",
44
"private": true,
5+
"type": "module",
6+
"scripts": {
7+
"dev": "vite",
8+
"build": "tsc -b && vite build",
9+
"lint": "eslint .",
10+
"preview": "vite preview",
11+
"format": "prettier --write '**/*.ts' '**/*.tsx' '**/*.css'"
12+
},
513
"dependencies": {
6-
"@catppuccin/palette": "^1.7.1",
14+
"react": "^18.3.1",
15+
"react-dom": "^18.3.1",
716
"@monaco-editor/react": "^4.6.0",
17+
"@catppuccin/palette": "^1.7.1",
818
"copy-to-clipboard": "^3.3.3",
919
"history": "^5.3.0",
10-
"local-storage": "^2.0.0",
1120
"monaco-editor": "^0.52.0",
1221
"monaco-themes": "^0.4.4",
1322
"pako": "^2.1.0",
14-
"react": "^19.0.0",
1523
"react-device-detect": "^2.2.3",
16-
"react-dom": "^19.0.0",
17-
"react-scripts": "^5.0.1",
1824
"styled-components": "^6.1.13",
19-
"typescript": "^5.7.2",
2025
"whatwg-mimetype": "^3.0.0"
2126
},
2227
"devDependencies": {
23-
"@testing-library/dom": "^10.4.0",
24-
"@testing-library/jest-dom": "^5.14.1",
25-
"@testing-library/react": "^16.1.0",
26-
"@testing-library/user-event": "^13.2.1",
27-
"@types/jest": "^27.0.1",
28-
"@types/node": "^18.11.9",
28+
"@eslint/js": "^9.17.0",
29+
"@types/react": "^18.3.18",
30+
"@types/react-dom": "^18.3.5",
2931
"@types/pako": "^2.0.3",
30-
"@types/react": "^19.0.0",
31-
"@types/react-dom": "^19.0.0",
3232
"@types/whatwg-mimetype": "^3.0.2",
33+
"@vitejs/plugin-react-swc": "^3.5.0",
34+
"eslint": "^9.17.0",
35+
"eslint-plugin-react-hooks": "^5.0.0",
36+
"eslint-plugin-react-refresh": "^0.4.16",
37+
"globals": "^15.14.0",
38+
"typescript": "~5.6.2",
39+
"typescript-eslint": "^8.18.2",
40+
"vite": "^6.0.5",
3341
"prettier": "^3.4.2",
3442
"prettier-plugin-organize-imports": "^4.1.0"
35-
},
36-
"scripts": {
37-
"start": "react-scripts start",
38-
"build": "CI=false react-scripts build",
39-
"test": "react-scripts test",
40-
"eject": "react-scripts eject",
41-
"format": "prettier --write '**/*.ts' '**/*.tsx' '**/*.css'",
42-
"compile": "tsc"
43-
},
44-
"eslintConfig": {
45-
"extends": [
46-
"react-app",
47-
"react-app/jest"
48-
]
49-
},
50-
"browserslist": {
51-
"production": [
52-
">0.2%",
53-
"not dead",
54-
"not op_mini all"
55-
],
56-
"development": [
57-
"last 1 chrome version",
58-
"last 1 firefox version",
59-
"last 1 safari version"
60-
]
6143
}
6244
}

‎src/components/EditorTextArea.tsx‎

Lines changed: 37 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,14 @@ import Editor, {
55
OnMount,
66
} from '@monaco-editor/react';
77
import history from 'history/browser';
8-
import { RefObject, useCallback, useEffect, useRef, useState } from 'react';
8+
import {
9+
MutableRefObject,
10+
RefObject,
11+
useCallback,
12+
useEffect,
13+
useRef,
14+
useState,
15+
} from 'react';
916
import styled from 'styled-components';
1017
import themes, { Theme } from '../style/themes';
1118

@@ -17,6 +24,34 @@ import { ResetFunction } from './Editor';
1724
import { loader } from '@monaco-editor/react';
1825
import * as monaco from 'monaco-editor';
1926

27+
import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker';
28+
import cssWorker from 'monaco-editor/esm/vs/language/css/css.worker?worker';
29+
import htmlWorker from 'monaco-editor/esm/vs/language/html/html.worker?worker';
30+
import jsonWorker from 'monaco-editor/esm/vs/language/json/json.worker?worker';
31+
import tsWorker from 'monaco-editor/esm/vs/language/typescript/ts.worker?worker';
32+
33+
self.MonacoEnvironment = {
34+
getWorker(_: string, label: string): Promise<Worker> | Worker {
35+
switch (label) {
36+
case 'json':
37+
return new jsonWorker();
38+
case 'css':
39+
case 'scss':
40+
case 'less':
41+
return new cssWorker();
42+
case 'html':
43+
case 'handlebars':
44+
case 'razor':
45+
return new htmlWorker();
46+
case 'typescript':
47+
case 'javascript':
48+
return new tsWorker();
49+
default:
50+
return new editorWorker();
51+
}
52+
},
53+
};
54+
2055
loader.config({ monaco });
2156

2257
export interface EditorTextAreaProps {
@@ -27,7 +62,7 @@ export interface EditorTextAreaProps {
2762
language: string;
2863
fontSize: number;
2964
readOnly: boolean;
30-
resetFunction: RefObject<ResetFunction | null>;
65+
resetFunction: MutableRefObject<ResetFunction | null>;
3166
}
3267

3368
export default function EditorTextArea({

‎src/components/MenuButton.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ export default function MenuButton<T extends string>({
1919

2020
// close the menu when a click is made elsewhere
2121
useEffect(() => {
22-
const listener = (e: MouseEvent) => setOpen(false);
22+
const listener = () => setOpen(false);
2323
window.addEventListener('click', listener);
2424
return () => window.removeEventListener('click', listener);
2525
}, [setOpen]);

‎src/hooks/usePreference.ts‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { get as lsGet, remove as lsRemove, set as lsSet } from 'local-storage';
21
import { Dispatch, SetStateAction, useEffect, useState } from 'react';
32

43
// hook used to load "preference" settings from local storage, or fall back to a default value.
@@ -8,7 +7,8 @@ export default function usePreference<T>(
87
valid: (value: T) => boolean
98
): [T, Dispatch<SetStateAction<T>>, (value: T) => boolean] {
109
const [value, setValue] = useState<T>(() => {
11-
const pref = lsGet(id) as T;
10+
const prefRaw = localStorage.getItem(id);
11+
const pref = prefRaw !== null ? (JSON.parse(prefRaw) as T) : undefined;
1212
if (pref && valid(pref)) {
1313
return pref;
1414
} else {
@@ -18,9 +18,9 @@ export default function usePreference<T>(
1818

1919
useEffect(() => {
2020
if (value === defaultValue) {
21-
lsRemove(id);
21+
localStorage.removeItem(id);
2222
} else {
23-
lsSet(id, value);
23+
localStorage.setItem(id, JSON.stringify(value));
2424
}
2525
}, [value, id, defaultValue]);
2626

src/index.tsx renamed to src/main.tsx

File renamed without changes.

‎src/style/styled.d.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,5 +2,6 @@ import 'styled-components';
22
import { Theme } from './themes';
33

44
declare module 'styled-components' {
5+
// eslint-disable-next-line @typescript-eslint/no-empty-object-type
56
export interface DefaultTheme extends Theme {}
67
}

0 commit comments

Comments
 (0)