poptart/lucko-paste
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Convert to Vite project

Browse Source
This commit is contained in:
Luck
2025-01-05 12:02:59 +00:00
parent b31aea56e4
commit 5b2ca9bd19
18 changed files with 829 additions and 9296 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
.gitignore vendored
View File

@@ -1,25 +1,24 @@
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. # Logs
logs
# dependencies *.log
/node_modules
/.pnp
.pnp.js
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log* npm-debug.log*
yarn-debug.log* yarn-debug.log*
yarn-error.log* yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
.idea node_modules
dist
dist-ssr
*.local
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

8
Dockerfile
View File

@@ -1,8 +1,8 @@
# Build stage # Build stage
FROM node:lts as build FROM node:lts AS build
ARG BYTEBIN_URL="data/" ARG BYTEBIN_URL="data/"
ENV REACT_APP_BYTEBIN_URL="${BYTEBIN_URL}" ENV VITE_BYTEBIN_URL="${BYTEBIN_URL}"
WORKDIR /app WORKDIR /app
COPY package.json yarn.lock ./ COPY package.json yarn.lock ./
@@ -13,6 +13,6 @@ RUN yarn build
# Run stage # Run stage
FROM nginx:alpine FROM nginx:alpine
COPY docker/nginx.conf /etc/nginx/conf.d/default.conf COPY docker/nginx.conf /etc/nginx/conf.d/default.conf
COPY --from=build /app/build /usr/share/nginx/html COPY --from=build /app/dist /usr/share/nginx/html
CMD ["nginx", "-g", "daemon off;"] CMD ["nginx", "-g", "daemon off;"]
EXPOSE 80/tcp EXPOSE 80/tcp

28
eslint.config.js Normal file
View File

@@ -0,0 +1,28 @@
import js from '@eslint/js'
import globals from 'globals'
import reactHooks from 'eslint-plugin-react-hooks'
import reactRefresh from 'eslint-plugin-react-refresh'
import tseslint from 'typescript-eslint'
export default tseslint.config(
{ ignores: ['dist'] },
{
extends: [js.configs.recommended, ...tseslint.configs.recommended],
files: ['**/*.{ts,tsx}'],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
},
plugins: {
'react-hooks': reactHooks,
'react-refresh': reactRefresh,
},
rules: {
...reactHooks.configs.recommended.rules,
'react-refresh/only-export-components': [
'warn',
{ allowConstantExport: true },
],
},
},
)

13
public/index.html → index.html
View File

@@ -11,20 +11,21 @@
<meta name="twitter:card" content="summary" /> <meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="pastes" /> <meta name="twitter:title" content="pastes" />
<meta name="twitter:description" content="a simple pastebin." /> <meta name="twitter:description" content="a simple pastebin." />
<meta name="twitter:image" content="%PUBLIC_URL%/assets/logo256.png" /> <meta name="twitter:image" content="https://pastes.dev/assets/logo256.png" />
<meta property="og:title" content="pastes" /> <meta property="og:title" content="pastes" />
<meta property="og:description" content="a simple pastebin." /> <meta property="og:description" content="a simple pastebin." />
<meta property="og:type" content="product" /> <meta property="og:type" content="product" />
<meta property="og:image" content="%PUBLIC_URL%/assets/logo256.png" /> <meta property="og:image" content="https://pastes.dev/assets/logo256.png" />
<meta property="og:url" content="%PUBLIC_URL%" /> <meta property="og:url" content="https://pastes.dev" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
<link href="%PUBLIC_URL%/assets/logo512.png" rel="shortcut icon" sizes="512x512" type="image/png"> <link rel="shortcut icon" href="/assets/logo512.png" sizes="512x512" type="image/png">
<link rel="apple-touch-icon" href="%PUBLIC_URL%/assets/logo256.png" /> <link rel="apple-touch-icon" href="/assets/logo256.png" />
</head> </head>
<body> <body>
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div> <div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body> </body>
</html> </html>

62
package.json
View File

@@ -2,61 +2,43 @@
"name": "paste", "name": "paste",
"version": "0.1.0", "version": "0.1.0",
"private": true, "private": true,
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc -b && vite build",
"lint": "eslint .",
"preview": "vite preview",
"format": "prettier --write '**/*.ts' '**/*.tsx' '**/*.css'"
},
"dependencies": { "dependencies": {
"@catppuccin/palette": "^1.7.1", "react": "^18.3.1",
"react-dom": "^18.3.1",
"@monaco-editor/react": "^4.6.0", "@monaco-editor/react": "^4.6.0",
"@catppuccin/palette": "^1.7.1",
"copy-to-clipboard": "^3.3.3", "copy-to-clipboard": "^3.3.3",
"history": "^5.3.0", "history": "^5.3.0",
"local-storage": "^2.0.0",
"monaco-editor": "^0.52.0", "monaco-editor": "^0.52.0",
"monaco-themes": "^0.4.4", "monaco-themes": "^0.4.4",
"pako": "^2.1.0", "pako": "^2.1.0",
"react": "^19.0.0",
"react-device-detect": "^2.2.3", "react-device-detect": "^2.2.3",
"react-dom": "^19.0.0",
"react-scripts": "^5.0.1",
"styled-components": "^6.1.13", "styled-components": "^6.1.13",
"typescript": "^5.7.2",
"whatwg-mimetype": "^3.0.0" "whatwg-mimetype": "^3.0.0"
}, },
"devDependencies": { "devDependencies": {
"@testing-library/dom": "^10.4.0", "@eslint/js": "^9.17.0",
"@testing-library/jest-dom": "^5.14.1", "@types/react": "^18.3.18",
"@testing-library/react": "^16.1.0", "@types/react-dom": "^18.3.5",
"@testing-library/user-event": "^13.2.1",
"@types/jest": "^27.0.1",
"@types/node": "^18.11.9",
"@types/pako": "^2.0.3", "@types/pako": "^2.0.3",
"@types/react": "^19.0.0",
"@types/react-dom": "^19.0.0",
"@types/whatwg-mimetype": "^3.0.2", "@types/whatwg-mimetype": "^3.0.2",
"@vitejs/plugin-react-swc": "^3.5.0",
"eslint": "^9.17.0",
"eslint-plugin-react-hooks": "^5.0.0",
"eslint-plugin-react-refresh": "^0.4.16",
"globals": "^15.14.0",
"typescript": "~5.6.2",
"typescript-eslint": "^8.18.2",
"vite": "^6.0.5",
"prettier": "^3.4.2", "prettier": "^3.4.2",
"prettier-plugin-organize-imports": "^4.1.0" "prettier-plugin-organize-imports": "^4.1.0"
},
"scripts": {
"start": "react-scripts start",
"build": "CI=false react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"format": "prettier --write '**/*.ts' '**/*.tsx' '**/*.css'",
"compile": "tsc"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
} }
} }

39
src/components/EditorTextArea.tsx
View File

@@ -5,7 +5,14 @@ import Editor, {
OnMount, OnMount,
} from '@monaco-editor/react'; } from '@monaco-editor/react';
import history from 'history/browser'; import history from 'history/browser';
import { RefObject, useCallback, useEffect, useRef, useState } from 'react'; import {
MutableRefObject,
RefObject,
useCallback,
useEffect,
useRef,
useState,
} from 'react';
import styled from 'styled-components'; import styled from 'styled-components';
import themes, { Theme } from '../style/themes'; import themes, { Theme } from '../style/themes';
@@ -17,6 +24,34 @@ import { ResetFunction } from './Editor';
import { loader } from '@monaco-editor/react'; import { loader } from '@monaco-editor/react';
import * as monaco from 'monaco-editor'; import * as monaco from 'monaco-editor';
import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker';
import cssWorker from 'monaco-editor/esm/vs/language/css/css.worker?worker';
import htmlWorker from 'monaco-editor/esm/vs/language/html/html.worker?worker';
import jsonWorker from 'monaco-editor/esm/vs/language/json/json.worker?worker';
import tsWorker from 'monaco-editor/esm/vs/language/typescript/ts.worker?worker';
self.MonacoEnvironment = {
getWorker(_: string, label: string): Promise<Worker> | Worker {
switch (label) {
case 'json':
return new jsonWorker();
case 'css':
case 'scss':
case 'less':
return new cssWorker();
case 'html':
case 'handlebars':
case 'razor':
return new htmlWorker();
case 'typescript':
case 'javascript':
return new tsWorker();
default:
return new editorWorker();
}
},
};
loader.config({ monaco }); loader.config({ monaco });
export interface EditorTextAreaProps { export interface EditorTextAreaProps {
@@ -27,7 +62,7 @@ export interface EditorTextAreaProps {
language: string; language: string;
fontSize: number; fontSize: number;
readOnly: boolean; readOnly: boolean;
resetFunction: RefObject<ResetFunction | null>; resetFunction: MutableRefObject<ResetFunction | null>;
} }
export default function EditorTextArea({ export default function EditorTextArea({

2
src/components/MenuButton.tsx
View File

@@ -19,7 +19,7 @@ export default function MenuButton<T extends string>({
// close the menu when a click is made elsewhere // close the menu when a click is made elsewhere
useEffect(() => { useEffect(() => {
const listener = (e: MouseEvent) => setOpen(false); const listener = () => setOpen(false);
window.addEventListener('click', listener); window.addEventListener('click', listener);
return () => window.removeEventListener('click', listener); return () => window.removeEventListener('click', listener);
}, [setOpen]); }, [setOpen]);

8
src/hooks/usePreference.ts
View File

@@ -1,4 +1,3 @@
import { get as lsGet, remove as lsRemove, set as lsSet } from 'local-storage';
import { Dispatch, SetStateAction, useEffect, useState } from 'react'; import { Dispatch, SetStateAction, useEffect, useState } from 'react';
// hook used to load "preference" settings from local storage, or fall back to a default value. // 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>(
valid: (value: T) => boolean valid: (value: T) => boolean
): [T, Dispatch<SetStateAction<T>>, (value: T) => boolean] { ): [T, Dispatch<SetStateAction<T>>, (value: T) => boolean] {
const [value, setValue] = useState<T>(() => { const [value, setValue] = useState<T>(() => {
const pref = lsGet(id) as T; const prefRaw = localStorage.getItem(id);
const pref = prefRaw !== null ? (JSON.parse(prefRaw) as T) : undefined;
if (pref && valid(pref)) { if (pref && valid(pref)) {
return pref; return pref;
} else { } else {
@@ -18,9 +18,9 @@ export default function usePreference<T>(
useEffect(() => { useEffect(() => {
if (value === defaultValue) { if (value === defaultValue) {
lsRemove(id); localStorage.removeItem(id);
} else { } else {
lsSet(id, value); localStorage.setItem(id, JSON.stringify(value));
} }
}, [value, id, defaultValue]); }, [value, id, defaultValue]);

0
src/index.tsx → src/main.tsx
View File

1
src/style/styled.d.ts vendored
View File

@@ -2,5 +2,6 @@ import 'styled-components';
import { Theme } from './themes'; import { Theme } from './themes';
declare module 'styled-components' { declare module 'styled-components' {
// eslint-disable-next-line @typescript-eslint/no-empty-object-type
export interface DefaultTheme extends Theme {} export interface DefaultTheme extends Theme {}
} }

3
src/util/constants.ts
View File

@@ -1,4 +1,3 @@
export const bytebinUrl = export const bytebinUrl =
process.env.REACT_APP_BYTEBIN_URL || 'https://bytebin.lucko.me/'; import.meta.env.VITE_BYTEBIN_URL || 'https://bytebin.lucko.me/';
export const postUrl = bytebinUrl + 'post'; export const postUrl = bytebinUrl + 'post';

2
src/util/storage.ts
View File

@@ -31,7 +31,7 @@ export async function loadFromBytebin(id: string): Promise<LoadResult> {
} else { } else {
return { ok: false }; return { ok: false };
} }
} catch (e) { } catch {
return { ok: false }; return { ok: false };
} }
} }

9
src/vite-env.d.ts vendored Normal file
View File

@@ -0,0 +1,9 @@
/// <reference types="vite/client" />
interface ImportMetaEnv {
readonly VITE_BYTEBIN_URL?: string;
}
interface ImportMeta {
readonly env: ImportMetaEnv;
}

26
tsconfig.app.json Normal file
View File

@@ -0,0 +1,26 @@
{
"compilerOptions": {
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
"target": "ES2020",
"useDefineForClassFields": true,
"lib": ["ES2020", "DOM", "DOM.Iterable"],
"module": "ESNext",
"skipLibCheck": true,
/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"isolatedModules": true,
"moduleDetection": "force",
"noEmit": true,
"jsx": "react-jsx",
/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true,
"noUncheckedSideEffectImports": true
},
"include": ["src"]
}

28
tsconfig.json
View File

@@ -1,27 +1,7 @@
{ {
"compilerOptions": { "files": [],
"target": "es5", "references": [
"lib": [ { "path": "./tsconfig.app.json" },
"dom", { "path": "./tsconfig.node.json" }
"dom.iterable",
"esnext"
],
"allowJs": false,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx"
},
"include": [
"src/*.ts",
"src/*.tsx"
] ]
} }

24
tsconfig.node.json Normal file
View File

@@ -0,0 +1,24 @@
{
"compilerOptions": {
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
"target": "ES2022",
"lib": ["ES2023"],
"module": "ESNext",
"skipLibCheck": true,
/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"isolatedModules": true,
"moduleDetection": "force",
"noEmit": true,
/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true,
"noUncheckedSideEffectImports": true
},
"include": ["vite.config.ts"]
}

7
vite.config.ts Normal file
View File

@@ -0,0 +1,7 @@
import react from '@vitejs/plugin-react-swc';
import { defineConfig } from 'vite';
// https://vite.dev/config/
export default defineConfig({
plugins: [react()],
});

9824
yarn.lock
View File

File diff suppressed because it is too large Load Diff