Skip to content

Commit a988ed2

Browse files
committed
Initial commit
0 parents  commit a988ed2

12 files changed

+5779
-0
lines changed

.eslintrc.js

+30
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
module.exports = {
2+
env: {
3+
browser: true,
4+
es6: true,
5+
},
6+
extends: [
7+
"eslint:recommended",
8+
"plugin:@typescript-eslint/eslint-recommended",
9+
"plugin:@typescript-eslint/recommended",
10+
"plugin:prettier/recommended",
11+
"plugin:react-hooks/recommended",
12+
],
13+
globals: {
14+
Atomics: "readonly",
15+
SharedArrayBuffer: "readonly",
16+
},
17+
parser: "@typescript-eslint/parser",
18+
parserOptions: {
19+
ecmaVersion: 11,
20+
sourceType: "module",
21+
},
22+
plugins: ["@typescript-eslint"],
23+
ignorePatterns: [".eslintrc.js", "node_modules/", "build/", "coverage/"],
24+
rules: {
25+
"@typescript-eslint/no-explicit-any": 0,
26+
"@typescript-eslint/no-unused-vars": 0,
27+
"@typescript-eslint/explicit-module-boundary-types": 0,
28+
"@typescript-eslint/no-empty-function": 0,
29+
},
30+
};

.github/workflows/node.js.yml

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
name: Node.js CI
2+
3+
on: [push]
4+
5+
jobs:
6+
build:
7+
runs-on: ubuntu-latest
8+
9+
steps:
10+
- uses: actions/checkout@v2
11+
- name: Use Node.js
12+
uses: actions/setup-node@v1
13+
with:
14+
node-version: "12.x"
15+
- run: yarn
16+
- run: yarn lint
17+
- run: yarn build

.gitignore

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
node_modules/
2+
build/
3+
coverage/

README.md

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
# React Admin JSON view ![GitHub release (latest by date)](https://img.shields.io/github/v/release/MrHertal/react-admin-json-view) ![GitHub Workflow Status](https://img.shields.io/github/workflow/status/MrHertal/react-admin-json-view/Node.js%20CI)
2+
3+
JSON field and input for [react-admin](https://github.com/marmelab/react-admin).
4+
Built with [react-json-view](https://github.com/mac-s-g/react-json-view).
5+
6+
## Installation
7+
8+
```sh
9+
npm install react-admin-json-view
10+
```

package.json

+60
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
{
2+
"name": "react-admin-json-view",
3+
"version": "1.0.0",
4+
"description": "JSON field and input for react-admin.",
5+
"repository": {
6+
"type": "git",
7+
"url": "https://github.com/MrHertal/react-admin-json-view"
8+
},
9+
"main": "build/index.js",
10+
"module": "build/index.es.js",
11+
"jsnext:main": "build/index.es.js",
12+
"scripts": {
13+
"build": "rollup -c",
14+
"lint": "eslint .",
15+
"test": "jest --coverage"
16+
},
17+
"author": "Grégoire Hertault",
18+
"license": "ISC",
19+
"files": [
20+
"build"
21+
],
22+
"jest": {
23+
"preset": "ts-jest",
24+
"testEnvironment": "jsdom",
25+
"testPathIgnorePatterns": [
26+
"<rootDir>/build/",
27+
"<rootDir>/node_modules/"
28+
]
29+
},
30+
"devDependencies": {
31+
"@rollup/plugin-commonjs": "^16.0.0",
32+
"@rollup/plugin-node-resolve": "^10.0.0",
33+
"@types/jest": "^26.0.15",
34+
"@typescript-eslint/eslint-plugin": "^4.8.0",
35+
"@typescript-eslint/parser": "^4.8.0",
36+
"eslint": "^7.13.0",
37+
"eslint-config-prettier": "^6.15.0",
38+
"eslint-plugin-prettier": "^3.1.4",
39+
"eslint-plugin-react-hooks": "^4.2.0",
40+
"jest": "^26.6.3",
41+
"prettier": "^2.1.2",
42+
"react": "^17.0.1",
43+
"react-admin": "^3.10.1",
44+
"react-dom": "^17.0.1",
45+
"rollup": "^2.33.2",
46+
"rollup-plugin-delete": "^2.0.0",
47+
"rollup-plugin-peer-deps-external": "^2.2.4",
48+
"rollup-plugin-typescript2": "^0.29.0",
49+
"ts-jest": "^26.4.4",
50+
"typescript": "^4.0.5"
51+
},
52+
"peerDependencies": {
53+
"react": "*",
54+
"react-admin": "*",
55+
"react-dom": "*"
56+
},
57+
"dependencies": {
58+
"react-json-view": "^1.19.1"
59+
}
60+
}

rollup.config.js

+39
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import commonjs from "@rollup/plugin-commonjs";
2+
import resolve from "@rollup/plugin-node-resolve";
3+
import del from "rollup-plugin-delete";
4+
import external from "rollup-plugin-peer-deps-external";
5+
import typescript from "rollup-plugin-typescript2";
6+
import pkg from "./package.json";
7+
8+
export default {
9+
input: "src/index.ts",
10+
output: [
11+
{
12+
file: pkg.main,
13+
format: "cjs",
14+
exports: "named",
15+
sourcemap: true,
16+
},
17+
{
18+
file: pkg.module,
19+
format: "es",
20+
exports: "named",
21+
sourcemap: true,
22+
},
23+
],
24+
plugins: [
25+
del({ targets: "build/*" }),
26+
external({
27+
includeDependencies: true,
28+
}),
29+
resolve(),
30+
typescript({
31+
rollupCommonJSResolveHack: true,
32+
exclude: "**/__tests__/**",
33+
clean: true,
34+
}),
35+
commonjs({
36+
include: ["node_modules/**"],
37+
}),
38+
],
39+
};

src/JsonField.tsx

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import React from "react";
2+
import { Labeled } from "react-admin";
3+
import ReactJson, { ReactJsonViewProps } from "react-json-view";
4+
5+
type Props = {
6+
source: string;
7+
record?: any;
8+
reactJsonOptions?: ReactJsonViewProps;
9+
};
10+
11+
export const JsonField: React.FC<Props> = ({
12+
source,
13+
record = {},
14+
reactJsonOptions = {},
15+
}) => {
16+
return (
17+
<Labeled source={source}>
18+
<ReactJson {...reactJsonOptions} src={record[source] || {}} />
19+
</Labeled>
20+
);
21+
};

src/JsonInput.tsx

+68
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
import { FormHelperText } from "@material-ui/core";
2+
import React from "react";
3+
import { InputHelperText, Labeled, useInput } from "react-admin";
4+
import ReactJson, {
5+
InteractionProps,
6+
ReactJsonViewProps,
7+
} from "react-json-view";
8+
9+
type Props = {
10+
source: string;
11+
helperText?: string;
12+
reactJsonOptions?: ReactJsonViewProps;
13+
};
14+
15+
export const JsonInput: React.FC<Props> = (props) => {
16+
const {
17+
input: { value, onChange },
18+
meta: { touched, error },
19+
isRequired,
20+
} = useInput(props);
21+
22+
const { source, helperText, reactJsonOptions } = props;
23+
24+
function onEdit(edit: InteractionProps) {
25+
onChange(edit.updated_src);
26+
27+
if (reactJsonOptions?.onEdit) {
28+
reactJsonOptions.onEdit(edit);
29+
}
30+
}
31+
32+
function onAdd(add: InteractionProps) {
33+
onChange(add.updated_src);
34+
35+
if (reactJsonOptions?.onAdd) {
36+
reactJsonOptions.onAdd(add);
37+
}
38+
}
39+
40+
function onDelete(del: InteractionProps) {
41+
onChange(del.updated_src);
42+
43+
if (reactJsonOptions?.onDelete) {
44+
reactJsonOptions.onDelete(del);
45+
}
46+
}
47+
48+
return (
49+
<div>
50+
<Labeled source={source} isRequired={isRequired}>
51+
<ReactJson
52+
{...reactJsonOptions}
53+
src={value || {}}
54+
onEdit={onEdit}
55+
onAdd={onAdd}
56+
onDelete={onDelete}
57+
/>
58+
</Labeled>
59+
<FormHelperText error={!!(touched && error)}>
60+
<InputHelperText
61+
touched={touched}
62+
error={error}
63+
helperText={helperText}
64+
/>
65+
</FormHelperText>
66+
</div>
67+
);
68+
};

src/index.ts

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import { JsonField } from "./JsonField";
2+
import { JsonInput } from "./JsonInput";
3+
4+
export { JsonField, JsonInput };

src/typings.d.ts

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
declare module "react-admin";

tsconfig.json

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
{
2+
"compilerOptions": {
3+
"outDir": "build",
4+
"module": "esnext",
5+
"target": "es5",
6+
"lib": ["es6", "dom", "es2016", "es2017"],
7+
"sourceMap": true,
8+
"allowJs": false,
9+
"declaration": true,
10+
"moduleResolution": "node",
11+
"forceConsistentCasingInFileNames": true,
12+
"noImplicitReturns": true,
13+
"noImplicitThis": true,
14+
"noImplicitAny": true,
15+
"strictNullChecks": true,
16+
"suppressImplicitAnyIndexErrors": true,
17+
"noUnusedLocals": true,
18+
"noUnusedParameters": true,
19+
"esModuleInterop": true,
20+
"jsx": "react"
21+
},
22+
"include": ["src"],
23+
"exclude": ["node_modules", "build"]
24+
}

0 commit comments

Comments
 (0)