You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@tinkerpop.apache.org by oy...@apache.org on 2021/07/31 12:12:56 UTC

[tinkerpop] 01/01: Make administrative adjustments to gremlint site

This is an automated email from the ASF dual-hosted git repository.

oyvindsabo pushed a commit to branch TINKERPOP-2591
in repository https://gitbox.apache.org/repos/asf/tinkerpop.git

commit 322859f6d77c164f9b1bc9c6ea87bb65e14ca212
Author: oyvindsabo <oy...@gmail.com>
AuthorDate: Fri Jul 23 07:30:18 2021 +0200

    Make administrative adjustments to gremlint site
    
    - Install gremlint from npm rather than from OyvindSabo/gremlint.
    - Add footer displaying current gremlint version and copyright notice.
---
 docs/gremlint/config-overrides.js                  |  7 ++
 docs/gremlint/package-lock.json                    | 79 ++++++++++++++++++++--
 docs/gremlint/package.json                         |  8 ++-
 docs/gremlint/src/App.tsx                          | 22 +++---
 .../index.tsx => components/CenteredContainer.tsx} | 17 ++---
 docs/gremlint/src/components/Footer.tsx            | 25 +++++++
 docs/gremlint/src/components/Navigator.tsx         | 10 +--
 docs/gremlint/src/components/StyleGuideRule.tsx    |  2 -
 docs/gremlint/src/components/View.tsx              | 25 +++++++
 docs/gremlint/src/views/StyleGuide/index.tsx       | 10 ++-
 10 files changed, 164 insertions(+), 41 deletions(-)

diff --git a/docs/gremlint/config-overrides.js b/docs/gremlint/config-overrides.js
new file mode 100644
index 0000000..642fd15
--- /dev/null
+++ b/docs/gremlint/config-overrides.js
@@ -0,0 +1,7 @@
+const { removeModuleScopePlugin, override, babelInclude } = require('customize-cra');
+const path = require('path');
+
+module.exports = override(
+  removeModuleScopePlugin(),
+  babelInclude([path.resolve('src'), path.resolve('./package-lock.json')]),
+);
diff --git a/docs/gremlint/package-lock.json b/docs/gremlint/package-lock.json
index ee7c445..b60c550 100644
--- a/docs/gremlint/package-lock.json
+++ b/docs/gremlint/package-lock.json
@@ -16,8 +16,10 @@
         "@types/node": "^12.0.0",
         "@types/react": "^16.9.53",
         "@types/react-dom": "^16.9.8",
-        "gremlint": "github:OyvindSabo/gremlint#master",
+        "customize-cra": "^1.0.0",
+        "gremlint": "^3.5.1",
         "react": "^17.0.1",
+        "react-app-rewired": "^2.1.8",
         "react-dom": "^17.0.1",
         "react-scripts": "^4.0.3",
         "sharp-router": "^4.1.5",
@@ -5411,6 +5413,14 @@
       "version": "3.0.7",
       "license": "MIT"
     },
+    "node_modules/customize-cra": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/customize-cra/-/customize-cra-1.0.0.tgz",
+      "integrity": "sha512-DbtaLuy59224U+xCiukkxSq8clq++MOtJ1Et7LED1fLszWe88EoblEYFBJ895sB1mC6B4uu3xPT/IjClELhMbA==",
+      "dependencies": {
+        "lodash.flow": "^3.5.0"
+      }
+    },
     "node_modules/cyclist": {
       "version": "1.0.1",
       "license": "MIT"
@@ -8034,8 +8044,12 @@
       "license": "ISC"
     },
     "node_modules/gremlint": {
-      "version": "1.0.0",
-      "license": "Apache-2.0"
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/gremlint/-/gremlint-3.5.1.tgz",
+      "integrity": "sha512-mnRAX0FtVMSlk0YNGbdTSJnKDYWhm4r2KFXFZS7rOqxMrKOFbKWJt1bSo0bkgBNIADJc1WMo8DtoTgmyQLVckA==",
+      "engines": {
+        "node": ">=10"
+      }
     },
     "node_modules/growly": {
       "version": "1.3.0",
@@ -10380,6 +10394,11 @@
       "version": "4.4.0",
       "license": "MIT"
     },
+    "node_modules/lodash.flow": {
+      "version": "3.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.flow/-/lodash.flow-3.5.0.tgz",
+      "integrity": "sha1-h79AKSuM+D5OjOGjrkIJ4gBxZ1o="
+    },
     "node_modules/lodash.memoize": {
       "version": "4.1.2",
       "license": "MIT"
@@ -13240,6 +13259,28 @@
         "node": ">=10"
       }
     },
+    "node_modules/react-app-rewired": {
+      "version": "2.1.8",
+      "resolved": "https://registry.npmjs.org/react-app-rewired/-/react-app-rewired-2.1.8.tgz",
+      "integrity": "sha512-wjXPdKPLscA7mn0I1de1NHrbfWdXz4S1ladaGgHVKdn1hTgKK5N6EdGIJM0KrS6bKnJBj7WuqJroDTsPKKr66Q==",
+      "dependencies": {
+        "semver": "^5.6.0"
+      },
+      "bin": {
+        "react-app-rewired": "bin/index.js"
+      },
+      "peerDependencies": {
+        "react-scripts": ">=2.1.3"
+      }
+    },
+    "node_modules/react-app-rewired/node_modules/semver": {
+      "version": "5.7.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
+      "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
+      "bin": {
+        "semver": "bin/semver"
+      }
+    },
     "node_modules/react-dev-utils": {
       "version": "11.0.4",
       "license": "MIT",
@@ -22250,6 +22291,14 @@
     "csstype": {
       "version": "3.0.7"
     },
+    "customize-cra": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/customize-cra/-/customize-cra-1.0.0.tgz",
+      "integrity": "sha512-DbtaLuy59224U+xCiukkxSq8clq++MOtJ1Et7LED1fLszWe88EoblEYFBJ895sB1mC6B4uu3xPT/IjClELhMbA==",
+      "requires": {
+        "lodash.flow": "^3.5.0"
+      }
+    },
     "cyclist": {
       "version": "1.0.1"
     },
@@ -23969,7 +24018,9 @@
       "version": "4.2.6"
     },
     "gremlint": {
-      "version": "1.0.0"
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/gremlint/-/gremlint-3.5.1.tgz",
+      "integrity": "sha512-mnRAX0FtVMSlk0YNGbdTSJnKDYWhm4r2KFXFZS7rOqxMrKOFbKWJt1bSo0bkgBNIADJc1WMo8DtoTgmyQLVckA=="
     },
     "growly": {
       "version": "1.3.0",
@@ -25487,6 +25538,11 @@
     "lodash.flatten": {
       "version": "4.4.0"
     },
+    "lodash.flow": {
+      "version": "3.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.flow/-/lodash.flow-3.5.0.tgz",
+      "integrity": "sha1-h79AKSuM+D5OjOGjrkIJ4gBxZ1o="
+    },
     "lodash.memoize": {
       "version": "4.1.2"
     },
@@ -27409,6 +27465,21 @@
         "whatwg-fetch": "^3.4.1"
       }
     },
+    "react-app-rewired": {
+      "version": "2.1.8",
+      "resolved": "https://registry.npmjs.org/react-app-rewired/-/react-app-rewired-2.1.8.tgz",
+      "integrity": "sha512-wjXPdKPLscA7mn0I1de1NHrbfWdXz4S1ladaGgHVKdn1hTgKK5N6EdGIJM0KrS6bKnJBj7WuqJroDTsPKKr66Q==",
+      "requires": {
+        "semver": "^5.6.0"
+      },
+      "dependencies": {
+        "semver": {
+          "version": "5.7.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
+          "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ=="
+        }
+      }
+    },
     "react-dev-utils": {
       "version": "11.0.4",
       "requires": {
diff --git a/docs/gremlint/package.json b/docs/gremlint/package.json
index be3b307..c974018 100644
--- a/docs/gremlint/package.json
+++ b/docs/gremlint/package.json
@@ -11,8 +11,10 @@
     "@types/node": "^12.0.0",
     "@types/react": "^16.9.53",
     "@types/react-dom": "^16.9.8",
-    "gremlint": "github:OyvindSabo/gremlint#master",
+    "customize-cra": "^1.0.0",
+    "gremlint": "^3.5.1",
     "react": "^17.0.1",
+    "react-app-rewired": "^2.1.8",
     "react-dom": "^17.0.1",
     "react-scripts": "^4.0.3",
     "sharp-router": "^4.1.5",
@@ -23,8 +25,8 @@
   "scripts": {
     "predeploy": "npm run build",
     "deploy": "gh-pages -d build",
-    "start": "react-scripts start",
-    "build": "react-scripts build",
+    "start": "react-app-rewired start",
+    "build": "react-app-rewired build",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
   },
diff --git a/docs/gremlint/src/App.tsx b/docs/gremlint/src/App.tsx
index d1bd9ef..1b846ff 100644
--- a/docs/gremlint/src/App.tsx
+++ b/docs/gremlint/src/App.tsx
@@ -24,13 +24,14 @@ import { useRouter } from 'sharp-router';
 import router from './router';
 import FadeIn from './components/FadeIn';
 import Navigator from './components/Navigator';
-import QueryFormatter from './views/QueryFormatter';
-import StyleGuide from './views/StyleGuide';
+import View from './components/View';
+import Footer from './components/Footer';
 import LoadingAnimation from './components/LoadingAnimation';
 
-const ViewWrapper = styled.div`
-  width: min(800px, 100vw);
-  margin-left: calc(50vw - min(400px, 50vw));
+const AppWrapper = styled.div`
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
 `;
 
 const App = () => {
@@ -39,14 +40,11 @@ const App = () => {
   if (!loadingComplete) return <LoadingAnimation onLoadingComplete={() => setLoadingComplete(true)} />;
   return (
     <FadeIn>
-      <div>
+      <AppWrapper>
         <Navigator matchedRoute={matchedRoute} />
-        <div>
-          <ViewWrapper>
-            {matchedRoute === '/' ? <QueryFormatter /> : matchedRoute === '/style-guide' ? <StyleGuide /> : null}
-          </ViewWrapper>
-        </div>
-      </div>
+        <View matchedRoute={matchedRoute} />
+        <Footer />
+      </AppWrapper>
     </FadeIn>
   );
 };
diff --git a/docs/gremlint/src/views/StyleGuide/index.tsx b/docs/gremlint/src/components/CenteredContainer.tsx
similarity index 69%
copy from docs/gremlint/src/views/StyleGuide/index.tsx
copy to docs/gremlint/src/components/CenteredContainer.tsx
index b83574c..9781ec7 100644
--- a/docs/gremlint/src/views/StyleGuide/index.tsx
+++ b/docs/gremlint/src/components/CenteredContainer.tsx
@@ -17,16 +17,11 @@
  * under the License.
  */
 
-import React from 'react';
-import StyleGuideRule from '../../components/StyleGuideRule';
-import { rules } from './rules';
+import styled from 'styled-components';
 
-const StyleGuide = () => (
-  <div>
-    {rules.map(({ title, explanation, example }) => (
-      <StyleGuideRule key={title} title={title} explanation={explanation} example={example} />
-    ))}
-  </div>
-);
+const CenteredContainer = styled.div`
+  width: min(800px, 100vw);
+  margin-left: calc(50vw - min(400px, 50vw));
+`;
 
-export default StyleGuide;
+export default CenteredContainer;
diff --git a/docs/gremlint/src/components/Footer.tsx b/docs/gremlint/src/components/Footer.tsx
new file mode 100644
index 0000000..1f1202c
--- /dev/null
+++ b/docs/gremlint/src/components/Footer.tsx
@@ -0,0 +1,25 @@
+import styled from 'styled-components';
+import CenteredContainer from './CenteredContainer';
+import { textColor } from '../styleVariables';
+import { packages } from '../../package-lock.json';
+
+const gremlintVersion = packages['node_modules/gremlint'].version;
+
+const FooterContent = styled.div`
+  padding: 10px;
+  color: ${textColor};
+  font-size: 15px;
+  text-align: center;
+  line-height: 20px;
+`;
+
+const Footer = () => (
+  <CenteredContainer>
+    <FooterContent>
+      <p>Gremlint version: {gremlintVersion}</p>
+      <p>Copyright © 2015-2021 The Apache Software Foundation.</p>
+    </FooterContent>
+  </CenteredContainer>
+);
+
+export default Footer;
diff --git a/docs/gremlint/src/components/Navigator.tsx b/docs/gremlint/src/components/Navigator.tsx
index fe62af5..15c0cee 100644
--- a/docs/gremlint/src/components/Navigator.tsx
+++ b/docs/gremlint/src/components/Navigator.tsx
@@ -19,6 +19,7 @@
 
 import React from 'react';
 import styled from 'styled-components';
+import CenteredContainer from './CenteredContainer';
 import NavigationButton from './NavigationButton';
 import { white } from '../styleVariables';
 
@@ -32,11 +33,6 @@ const NavigatorWrapper = styled.div`
   z-index: 1;
 `;
 
-const NavigatorCenterContainer = styled.div`
-  width: min(800px, 100vw);
-  margin-left: calc(50vw - min(400px, 50vw));
-`;
-
 const Spacer = styled.div`
   height: 40px;
 `;
@@ -48,10 +44,10 @@ type NavigatorProps = {
 const Navigator = ({ matchedRoute }: NavigatorProps) => (
   <div>
     <NavigatorWrapper>
-      <NavigatorCenterContainer>
+      <CenteredContainer>
         <NavigationButton isSelected={matchedRoute === '/'} label="Query formatter" href="#/" />
         <NavigationButton isSelected={matchedRoute === '/style-guide'} label="Style guide" href="#/style-guide" />
-      </NavigatorCenterContainer>
+      </CenteredContainer>
     </NavigatorWrapper>
     <Spacer />
   </div>
diff --git a/docs/gremlint/src/components/StyleGuideRule.tsx b/docs/gremlint/src/components/StyleGuideRule.tsx
index 825bcb7..ce31700 100644
--- a/docs/gremlint/src/components/StyleGuideRule.tsx
+++ b/docs/gremlint/src/components/StyleGuideRule.tsx
@@ -21,7 +21,6 @@ import React from 'react';
 import Paragraph from './Paragraph';
 import Title from './Title';
 import CodePreview from './CodePreview';
-import Spacer from './Spacer';
 
 type StyleGuideRuleProps = {
   title: string;
@@ -34,7 +33,6 @@ const StyleGuideRule = ({ title, explanation, example }: StyleGuideRuleProps) =>
     <Title>{title}</Title>
     <Paragraph>{explanation}</Paragraph>
     <CodePreview>{example}</CodePreview>
-    <Spacer />
   </div>
 );
 
diff --git a/docs/gremlint/src/components/View.tsx b/docs/gremlint/src/components/View.tsx
new file mode 100644
index 0000000..f9ae890
--- /dev/null
+++ b/docs/gremlint/src/components/View.tsx
@@ -0,0 +1,25 @@
+import React from 'react';
+import styled from 'styled-components';
+import QueryFormatter from '../views/QueryFormatter';
+import StyleGuide from '../views/StyleGuide';
+import CenteredContainer from './CenteredContainer';
+
+const ViewWrapper = styled.div`
+  flex-grow: 1;
+`;
+
+type ViewProps = {
+  matchedRoute: string;
+};
+
+const View = ({ matchedRoute }: ViewProps) => {
+  return (
+    <ViewWrapper>
+      <CenteredContainer>
+        {matchedRoute === '/' ? <QueryFormatter /> : matchedRoute === '/style-guide' ? <StyleGuide /> : null}
+      </CenteredContainer>
+    </ViewWrapper>
+  );
+};
+
+export default View;
diff --git a/docs/gremlint/src/views/StyleGuide/index.tsx b/docs/gremlint/src/views/StyleGuide/index.tsx
index b83574c..7b715aa 100644
--- a/docs/gremlint/src/views/StyleGuide/index.tsx
+++ b/docs/gremlint/src/views/StyleGuide/index.tsx
@@ -18,15 +18,21 @@
  */
 
 import React from 'react';
+import styled from 'styled-components';
 import StyleGuideRule from '../../components/StyleGuideRule';
 import { rules } from './rules';
 
+const StyleGuideWrapper = styled.div`
+  display: grid;
+  grid-row-gap: 20px;
+`;
+
 const StyleGuide = () => (
-  <div>
+  <StyleGuideWrapper>
     {rules.map(({ title, explanation, example }) => (
       <StyleGuideRule key={title} title={title} explanation={explanation} example={example} />
     ))}
-  </div>
+  </StyleGuideWrapper>
 );
 
 export default StyleGuide;