Merge pull request #1 from skat/demoPage

Demo page

demoReactPage/.gitignore

@@ -0,0 +1,21 @@
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

demoReactPage/package.json

@@ -0,0 +1,44 @@
+{
+  "homepage": "http://skat.github.io//dms-public//demoReactPage",
+  "name": "demoReactPage",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "@testing-library/jest-dom": "^5.11.9",
+    "@testing-library/react": "^11.2.5",
+    "@testing-library/user-event": "^12.8.1",
+    "react": "^17.0.1",
+    "react-dom": "^17.0.1",
+    "react-scripts": "4.0.3",
+    "web-vitals": "^1.1.0"
+  },
+  "scripts": {
+    "predeploy": "npm run build",
+	"deploy": "gh-pages -d build",  
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject"
+  },
+  "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"
+    ]
+  },
+  "devDependencies": {
+    "gh-pages": "^3.1.0"
+  }
+}

demoReactPage/src/createServiceWorker.js

@@ -0,0 +1,52 @@
+// In production, we register a service worker to serve assets from local cache.
+
+// This lets the app load faster on subsequent visits in production, and gives
+// it offline capabilities. However, it also means that developers (and users)
+// will only see deployed updates on the "N+1" visit to a page, since previously
+// cached resources are updated in the background.
+
+// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
+// This link also includes instructions on opting out of this behavior.
+
+export default function register() {
+  if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
+    window.addEventListener('load', () => {
+      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
+      navigator.serviceWorker
+        .register(swUrl)
+        .then(registration => {
+          // eslint-disable-next-line no-param-reassign
+          registration.onupdatefound = () => {
+            const installingWorker = registration.installing;
+            installingWorker.onstatechange = () => {
+              if (installingWorker.state === 'installed') {
+                if (navigator.serviceWorker.controller) {
+                  // At this point, the old content will have been purged and
+                  // the fresh content will have been added to the cache.
+                  // It's the perfect time to display a "New content is
+                  // available; please refresh." message in your web app.
+                  console.log('New content is available; please refresh.'); // eslint-disable-line no-console
+                } else {
+                  // At this point, everything has been precached.
+                  // It's the perfect time to display a
+                  // "Content is cached for offline use." message.
+                  console.log('Content is cached for offline use.'); // eslint-disable-line no-console
+                }
+              }
+            };
+          };
+        })
+        .catch(error => {
+          console.error('Error during service worker registration:', error);
+        });
+    });
+  }
+}
+
+export function unregister() {
+  if ('serviceWorker' in navigator) {
+    navigator.serviceWorker.ready.then(registration => {
+      registration.unregister();
+    });
+  }
+}

demoReactPage/src/demo.js

@@ -0,0 +1,66 @@
+import React from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import TreeView from '@material-ui/lab/TreeView';
+import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
+import ChevronRightIcon from '@material-ui/icons/ChevronRight';
+import TreeItem from '@material-ui/lab/TreeItem';
+
+const useStyles = makeStyles({
+  root: {
+    height: 240,
+    flexGrow: 1,
+    maxWidth: 400,
+  },
+});
+
+export default function FileSystemNavigator() {
+  const classes = useStyles();
+
+  return (
+    <TreeView
+      className={classes.root}
+      defaultCollapseIcon={<ExpandMoreIcon />}
+      defaultExpandIcon={<ChevronRightIcon />}
+    >
+        <TreeItem nodeId="1" label="Declaration">
+          <TreeItem nodeId="2" label="FunctionCode" />
+          <TreeItem nodeId="3" label="ReferenceID" />
+          <TreeItem nodeId="4" label="ID" />
+          <TreeItem nodeId="5" label="TypeCode" />
+          <TreeItem nodeId="6" label="GoodsItemQuality" />
+
+          <TreeItem nodeId="8" label="DeclarationOfficeID" />
+          <TreeItem nodeId="9" label="TotalGrossMarkedMeasure" />
+          <TreeItem nodeId="10" label="Submitter" >
+            <TreeItem nodeId="111" label="Name" />
+          </TreeItem>
+          <TreeItem nodeId="11" label="Agent" >
+            <TreeItem nodeId="112" label="Name" />
+            <TreeItem nodeId="113" label="ID" />
+            <TreeItem nodeId="114" label="FunctionCode" />
+          </TreeItem>
+          <TreeItem nodeId="12" label="Declarant" >
+            <TreeItem nodeId="122" label="Name" />
+            <TreeItem nodeId="123" label="ID" />
+            <TreeItem nodeId="124" label="Address" />
+          </TreeItem>
+          <TreeItem nodeId="13" label="Exporter" >
+            <TreeItem nodeId="132" label="Name" />
+            <TreeItem nodeId="133" label="ID" />
+            <TreeItem nodeId="134" label="Address" />
+          </TreeItem>
+          <TreeItem nodeId="14" label="GoodsShipment" >
+            <TreeItem nodeId="142" label="AdditionalDocumentation" />
+            <TreeItem nodeId="143" label="AdditionalInformation" />
+            <TreeItem nodeId="144" label="Consignment" />
+            <TreeItem nodeId="145" label="CustomsValuation" />
+            <TreeItem nodeId="146" label="DomesticDutyTaxParty" />
+            <TreeItem nodeId="147" label="GovernmentAgencyGoodsItem" />
+            <TreeItem nodeId="148" label="Importer" />
+            <TreeItem nodeId="149" label="PreviousDocument" />
+            <TreeItem nodeId="1499" label="UCR" />
+          </TreeItem>
+        </TreeItem>
+      </TreeView>
+  );
+}

demoReactPage/src/index.js

@@ -0,0 +1,7 @@
+
+import React from 'react';
+import ReactDOM from 'react-dom';
+import Demo from './demo';
+
+ReactDOM.render(<Demo />, document.querySelector('#root'));
+

demoReactPage/src/package.json

@@ -0,0 +1,14 @@
+{
+  "title": "Material demo",
+  "devDependencies": {
+    "react-scripts": "latest"
+  },
+  "description": "https://github.com/mui-org/material-ui/blob/master/docs/src/pages/components/tree-view/FileSystemNavigator.js",
+  "dependencies": {
+    "react-dom": "latest",
+    "react": "latest",
+    "@material-ui/lab": "latest",
+    "@material-ui/icons": "latest",
+    "@material-ui/core": "latest"
+  }
+}