mirror of
https://github.com/balzack/databag.git
synced 2025-04-20 16:45:25 +00:00
Typescript (#92)
* Add ignore dsstore node_modules * Rename to typescript rnr -r '(.*)\.js$' '$1.ts' ./src ./test rnr -rf '(.*)\.jsx$' '$1.tsx' ./src ./test * Remove package lock * Fix extension of tsx at context * init typescript * . * Compiles, moved to vite * lint new files * check dashboard * Add dist to ignore file
This commit is contained in:
Lucian I. Last
GitHub
parent
ed53e4915f
commit
71c65efa20
3
.gitignore
vendored
3
.gitignore
vendored
@ -14,3 +14,6 @@
|
||||
|
||||
# Dependency directories (remove the comment below to include it)
|
||||
# vendor/
|
||||
node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
@ -1,6 +0,0 @@
|
||||
module.exports = {
|
||||
presets: [
|
||||
'@babel/preset-env',
|
||||
['@babel/preset-react', {runtime: 'automatic'}],
|
||||
],
|
||||
};
|
||||
21
net/web/index.html
Normal file
21
net/web/index.html
Normal file
@ -0,0 +1,21 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<meta
|
||||
name="Databag"
|
||||
content="Communication for the Decentralized Web"
|
||||
/>
|
||||
<link rel="apple-touch-icon" href="/logo192.png" />
|
||||
<link rel="manifest" href="/manifest.json" />
|
||||
<title>Databag</title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/index.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
12
net/web/jest.config.js
Normal file
12
net/web/jest.config.js
Normal file
@ -0,0 +1,12 @@
|
||||
/** @type {import('ts-jest').JestConfigWithTsJest} */
|
||||
export default {
|
||||
preset: 'ts-jest',
|
||||
testEnvironment: 'jsdom',
|
||||
modulePaths: ['<rootDir>/src/'],
|
||||
testMatch: ['**/test/**'],
|
||||
moduleNameMapper: {
|
||||
'\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': '<rootDir>/mock/fileMock.js',
|
||||
'\\.(css|less|scss|sass)$': 'identity-obj-proxy',
|
||||
// "(.*)": "<rootDir>/src/$1",
|
||||
},
|
||||
};
|
||||
@ -1,6 +0,0 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"baseUrl": "src"
|
||||
},
|
||||
"include": ["src"]
|
||||
}
|
||||
@ -2,19 +2,7 @@
|
||||
"name": "databag",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"jest": {
|
||||
"testEnvironment": "jsdom",
|
||||
"modulePaths": [
|
||||
"<rootDir>/src/"
|
||||
],
|
||||
"testMatch": [
|
||||
"**/test/**"
|
||||
],
|
||||
"moduleNameMapper": {
|
||||
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/mock/fileMock.js",
|
||||
"\\.(css|less|scss|sass)$": "identity-obj-proxy"
|
||||
}
|
||||
},
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"@charliewilco/gluejar": "^1.0.0",
|
||||
"@testing-library/jest-dom": "^5.14.1",
|
||||
@ -33,15 +21,13 @@
|
||||
"react-image-file-resizer": "^0.4.8",
|
||||
"react-resize-detector": "^7.0.0",
|
||||
"react-router-dom": "^6.2.2",
|
||||
"react-scripts": "5.0.0",
|
||||
"styled-components": "^5.3.3",
|
||||
"web-vitals": "^2.1.0"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "react-scripts start",
|
||||
"build": "react-scripts build",
|
||||
"test": "react-scripts test",
|
||||
"eject": "react-scripts eject"
|
||||
"start": "vite",
|
||||
"build": "vite build",
|
||||
"test": "jest"
|
||||
},
|
||||
"eslintConfig": {
|
||||
"extends": [
|
||||
@ -62,14 +48,25 @@
|
||||
]
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/preset-env": "^7.20.2",
|
||||
"@babel/preset-react": "^7.18.6",
|
||||
"@testing-library/dom": "^8.19.1",
|
||||
"@testing-library/react": "^13.4.0",
|
||||
"@types/jest": "^29.5.12",
|
||||
"@types/react": "^18.2.66",
|
||||
"@types/react-dom": "^18.2.22",
|
||||
"@typescript-eslint/eslint-plugin": "^7.2.0",
|
||||
"@typescript-eslint/parser": "^7.2.0",
|
||||
"@vitejs/plugin-react-swc": "^3.5.0",
|
||||
"babel-jest": "^29.3.1",
|
||||
"eslint": "^8.57.0",
|
||||
"eslint-plugin-react-hooks": "^4.6.0",
|
||||
"eslint-plugin-react-refresh": "^0.4.6",
|
||||
"identity-obj-proxy": "^3.0.0",
|
||||
"jest": "^29.3.1",
|
||||
"jest": "^29.7.0",
|
||||
"jest-environment-jsdom": "^29.3.1",
|
||||
"react-test-renderer": "^18.2.0"
|
||||
"react-test-renderer": "^18.2.0",
|
||||
"ts-jest": "^29.1.2",
|
||||
"typescript": "^5.4.5",
|
||||
"vite": "^5.2.0",
|
||||
"vite-tsconfig-paths": "^4.3.2"
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,43 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<meta
|
||||
name="Databag"
|
||||
content="Communication for the Decentralized Web"
|
||||
/>
|
||||
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
|
||||
<!--
|
||||
manifest.json provides metadata used when your web app is installed on a
|
||||
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
|
||||
-->
|
||||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
||||
<!--
|
||||
Notice the use of %PUBLIC_URL% in the tags above.
|
||||
It will be replaced with the URL of the `public` folder during the build.
|
||||
Only files inside the `public` folder can be referenced from the HTML.
|
||||
|
||||
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
|
||||
work correctly both with client-side routing and a non-root public URL.
|
||||
Learn how to configure a non-root public URL by running `npm run build`.
|
||||
-->
|
||||
<title>Databag</title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||
<div id="root"></div>
|
||||
<!--
|
||||
This HTML file is a template.
|
||||
If you open it directly in the browser, you will see an empty page.
|
||||
|
||||
You can add webfonts, meta tags, or analytics to this file.
|
||||
The build step will place the bundled scripts into the <body> tag.
|
||||
|
||||
To begin the development, run `npm start` or `yarn start`.
|
||||
To create a production bundle, use `npm run build` or `yarn build`.
|
||||
-->
|
||||
</body>
|
||||
</html>
|
||||
@ -13,7 +13,7 @@ export function useAdmin() {
|
||||
placeholder: '',
|
||||
unclaimed: null,
|
||||
busy: false,
|
||||
strings: {},
|
||||
strings: {} as Record<string, string>,
|
||||
menuStyle: {},
|
||||
});
|
||||
|
||||
@ -14,7 +14,7 @@ export function useCreateAccount() {
|
||||
busy: false,
|
||||
validatetatus: 'success',
|
||||
help: '',
|
||||
strings: {},
|
||||
strings: {} as Record<string,string>,
|
||||
menuStyle: {},
|
||||
});
|
||||
|
||||
@ -13,7 +13,7 @@ export function useLogin() {
|
||||
availableSet: false,
|
||||
disabled: true,
|
||||
busy: false,
|
||||
strings: {},
|
||||
strings: {} as Record<string,string>,
|
||||
menuStyle: {},
|
||||
});
|
||||
|
||||
@ -13,7 +13,7 @@ export function useAccess() {
|
||||
themes: [],
|
||||
language: null,
|
||||
languages: [],
|
||||
strings: {},
|
||||
strings: {} as Record<string,string>,
|
||||
});
|
||||
|
||||
const navigate = useNavigate();
|
||||
@ -32,7 +32,7 @@ export function useAccess() {
|
||||
}, [app.state, navigate]);
|
||||
|
||||
useEffect(() => {
|
||||
let params = new URLSearchParams(location);
|
||||
let params = new URLSearchParams(location+"");
|
||||
let token = params.get("access");
|
||||
if (token) {
|
||||
const access = async () => {
|
||||
@ -12,17 +12,17 @@ export function checkResponse(response) {
|
||||
}
|
||||
}
|
||||
|
||||
export async function fetchWithTimeout(url, options) {
|
||||
export async function fetchWithTimeout(url, options):Promise<Response> {
|
||||
return Promise.race([
|
||||
fetch(url, options).catch(err => { throw new Error(url + ' failed'); }),
|
||||
new Promise((_, reject) => setTimeout(() => reject(new Error(url + ' timeout')), TIMEOUT))
|
||||
new Promise<Response>((_, reject) => setTimeout(() => reject(new Error(url + ' timeout')), TIMEOUT))
|
||||
]);
|
||||
}
|
||||
|
||||
export async function fetchWithCustomTimeout(url, options, timeout) {
|
||||
export async function fetchWithCustomTimeout(url, options, timeout):Promise<Response> {
|
||||
return Promise.race([
|
||||
fetch(url, options).catch(err => { throw new Error(url + ' failed'); }),
|
||||
new Promise((_, reject) => setTimeout(() => reject(new Error(url + ' timeout')), timeout))
|
||||
new Promise<Response>((_, reject) => setTimeout(() => reject(new Error(url + ' timeout')), timeout))
|
||||
]);
|
||||
}
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import { checkResponse, fetchWithTimeout } from './fetchUtil';
|
||||
|
||||
export async function getContactChannels(server, token, viewRevision, channelRevision) {
|
||||
export async function getContactChannels(server, token, viewRevision?, channelRevision?) {
|
||||
let host = "";
|
||||
if (server) {
|
||||
host = `https://${server}`;
|
||||
@ -2,15 +2,21 @@ import React, { useState, useEffect, useRef } from 'react';
|
||||
import { CarouselWrapper } from './Carousel.styled';
|
||||
import { CloseOutlined } from '@ant-design/icons';
|
||||
import ReactResizeDetector from 'react-resize-detector';
|
||||
interface Props {
|
||||
pad?:any
|
||||
items?:any
|
||||
itemRenderer?:any
|
||||
itemRemove?:any
|
||||
|
||||
export function Carousel({ pad, items, itemRenderer, itemRemove }) {
|
||||
}
|
||||
export function Carousel({ pad, items, itemRenderer, itemRemove }:Props) {
|
||||
const [slots, setSlots] = useState([]);
|
||||
|
||||
let carousel = useRef();
|
||||
let carousel = useRef<any>();
|
||||
|
||||
const RemoveItem = ({ index }) => {
|
||||
if (itemRemove) {
|
||||
return <div class="delitem" onClick={() => itemRemove(index)}><CloseOutlined /></div>
|
||||
return <div className="delitem" onClick={() => itemRemove(index)}><CloseOutlined /></div>
|
||||
}
|
||||
return <></>
|
||||
}
|
||||
@ -22,8 +28,8 @@ export function Carousel({ pad, items, itemRenderer, itemRemove }) {
|
||||
<ReactResizeDetector handleWidth={true} handleHeight={false}>
|
||||
{({ width, height }) => {
|
||||
return (
|
||||
<div class="item noselect">
|
||||
<div class="asset">{ itemRenderer(items[i], i) }</div>
|
||||
<div className="item noselect">
|
||||
<div className="asset">{ itemRenderer(items[i], i) }</div>
|
||||
<RemoveItem index={i} />
|
||||
</div>
|
||||
);
|
||||
@ -32,14 +38,14 @@ export function Carousel({ pad, items, itemRenderer, itemRemove }) {
|
||||
));
|
||||
}
|
||||
if (items.length > 0) {
|
||||
assets.push(<div class="space"></div>)
|
||||
assets.push(<div className="space"></div>)
|
||||
}
|
||||
setSlots(assets);
|
||||
}, [items, itemRenderer]);
|
||||
|
||||
return (
|
||||
<CarouselWrapper>
|
||||
<div class="carousel" style={{ paddingLeft: pad + 32 }} ref={carousel}>
|
||||
<div className="carousel" style={{ paddingLeft: pad + 32 }} ref={carousel}>
|
||||
{slots}
|
||||
</div>
|
||||
</CarouselWrapper>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user