diff --git a/docs/.prettierignore b/docs/.prettierignore new file mode 100644 index 00000000000..5775b0004e7 --- /dev/null +++ b/docs/.prettierignore @@ -0,0 +1,4 @@ +# Add files here to ignore them from prettier formatting + +/build +/docs diff --git a/docs/.prettierrc b/docs/.prettierrc new file mode 100644 index 00000000000..c8c9721a97c --- /dev/null +++ b/docs/.prettierrc @@ -0,0 +1,5 @@ +{ + "singleQuote": true, + "trailingComma": "es5", + "arrowParens": "avoid" +} diff --git a/docs/docusaurus.config.js b/docs/docusaurus.config.js index 8806ebbb212..f5ba5f0bbe6 100644 --- a/docs/docusaurus.config.js +++ b/docs/docusaurus.config.js @@ -43,8 +43,11 @@ const config = { docs: { routeBasePath: '/', sidebarPath: require.resolve('./sidebars.js'), - editUrl: ({ docPath }) => `https://github.com/hasura/graphql-engine/edit/master/docs/docs/${docPath}`, - docItemComponent: require.resolve('./src/components/CustomDocItem/index.tsx'), + editUrl: ({ docPath }) => + `https://github.com/hasura/graphql-engine/edit/master/docs/docs/${docPath}`, + docItemComponent: require.resolve( + './src/components/CustomDocItem/index.tsx' + ), exclude: ['**/*.wip'], breadcrumbs: true, // showLastUpdateAuthor: true, @@ -73,9 +76,12 @@ const config = { id: 'wiki', path: 'wiki', routeBasePath: 'wiki', - editUrl: ({ docPath }) => `https://github.com/hasura/graphql-engine/edit/master/docs/docs/${docPath}`, + editUrl: ({ docPath }) => + `https://github.com/hasura/graphql-engine/edit/master/docs/docs/${docPath}`, editCurrentVersion: true, - docItemComponent: require.resolve('./src/components/CustomDocItem/CustomDocItemWiki.tsx'), + docItemComponent: require.resolve( + './src/components/CustomDocItem/CustomDocItemWiki.tsx' + ), // disableVersioning: true, breadcrumbs: false, sidebarPath: require.resolve('./sidebarsWiki.js'), @@ -84,7 +90,10 @@ const config = { }), ], [ - path.resolve(__dirname, './src/plugins/docusaurus-plugin-segment-analytics'), + path.resolve( + __dirname, + './src/plugins/docusaurus-plugin-segment-analytics' + ), { prodKey: 'RQXoHRpNcmBKllUDihjDjupGv4AHn5TB', devKey: 'FRKElp5cyMax6GAdM8OVyNMIFVppgEgp', @@ -118,11 +127,20 @@ const config = { disableSwitch: false, respectPrefersColorScheme: true, }, - image: 'https://graphql-engine-cdn.hasura.io/assets/hge-docs/og-image.png', + image: + 'https://graphql-engine-cdn.hasura.io/assets/hge-docs/og-image.png', prism: { theme: lightCodeTheme, darkTheme: darkCodeTheme, - additionalLanguages: ['rest', 'http', 'haskell', 'plsql', 'docker', 'nginx', 'markdown'], + additionalLanguages: [ + 'rest', + 'http', + 'haskell', + 'plsql', + 'docker', + 'nginx', + 'markdown', + ], }, algolia: { // If Algolia did not provide you any appId, use 'BH4D9OD16A' diff --git a/docs/package.json b/docs/package.json index 152ae093b80..6d0266ca11d 100644 --- a/docs/package.json +++ b/docs/package.json @@ -20,7 +20,8 @@ "write-heading-ids": "docusaurus write-heading-ids", "typecheck": "tsc", "spellcheck": "./spell_check.sh", - "spelladd": "./spell_add.sh" + "spelladd": "./spell_add.sh", + "format": "prettier --write \"**/*.+(js|jsx|css|json|md|mdx)\"" }, "dependencies": { "@docusaurus/core": "^2.2.0", @@ -45,7 +46,7 @@ "@docusaurus/module-type-aliases": "^2.1.0", "@swc/core": "^1.3.23", "@tsconfig/docusaurus": "^1.0.6", - "prettier": "^2.7.1", + "prettier": "^3.0.0", "swc-loader": "^0.2.3", "typescript": "^4.8.4" }, diff --git a/docs/sidebars.js b/docs/sidebars.js index 9bfb5f1feba..3a2a7047dff 100644 --- a/docs/sidebars.js +++ b/docs/sidebars.js @@ -27,7 +27,6 @@ module.exports = { { type: 'autogenerated', dirName: '.', // generate sidebar from the docs folder (or versioned_docs/) - }, ], }; diff --git a/docs/sidebarsWiki.js b/docs/sidebarsWiki.js index 587c7aa9ca5..a0beee9ab58 100644 --- a/docs/sidebarsWiki.js +++ b/docs/sidebarsWiki.js @@ -18,9 +18,7 @@ const sidebars = { { type: 'category', label: 'Docs Wiki', - items: [ - { type: 'autogenerated', dirName: '.' } - ], + items: [{ type: 'autogenerated', dirName: '.' }], }, // { type: 'autogenerated', dirName: 'migration-guide' }, ], diff --git a/docs/src/components/CloudDeployURLGenerationForm/index.jsx b/docs/src/components/CloudDeployURLGenerationForm/index.jsx index 0925b6c3021..b2d579bd6f6 100644 --- a/docs/src/components/CloudDeployURLGenerationForm/index.jsx +++ b/docs/src/components/CloudDeployURLGenerationForm/index.jsx @@ -17,7 +17,7 @@ const CloudDeployURLGenerationForm = () => { }, [repoName, branchName, pathToDir]); // Handle form input change - const handleChange = (e) => { + const handleChange = e => { const { name, value } = e.target; switch (name) { case 'github-repo': @@ -38,18 +38,27 @@ const CloudDeployURLGenerationForm = () => { const handleSubmit = () => { // check for empty fields if (repoName === '') { - alert('The repository name is empty. Please fill it out before proceeding.'); + alert( + 'The repository name is empty. Please fill it out before proceeding.' + ); return; } // check for whitespace or spaces in the fields - if (repoName.includes(' ') || branchName.includes(' ') || pathToDir.includes(' ')) { - alert('One or more fields contain whitespace. Please remove it and try again.'); + if ( + repoName.includes(' ') || + branchName.includes(' ') || + pathToDir.includes(' ') + ) { + alert( + 'One or more fields contain whitespace. Please remove it and try again.' + ); return; } - const url = 'https://cloud.hasura.io/deploy' - + `?github_repo=${repoName}` - + `&hasura_dir=${pathToDir !== '' ? pathToDir : '/' }` - + ((branchName !== '') ? `&branch=${branchName}` : ''); + const url = + 'https://cloud.hasura.io/deploy' + + `?github_repo=${repoName}` + + `&hasura_dir=${pathToDir !== '' ? pathToDir : '/'}` + + (branchName !== '' ? `&branch=${branchName}` : ''); setUrl(url); navigator.clipboard.writeText(url); @@ -68,49 +77,58 @@ const CloudDeployURLGenerationForm = () => { // we're calling the styles object here to apply the styles to the elements using their class names
- + Enter the URL of the GitHub repository containing the Hasura assets handleChange(e)} - placeholder='e.g. https://github.com/your-github-username/repository-name' + onChange={e => handleChange(e)} + placeholder="e.g. https://github.com/your-github-username/repository-name" />
- + - Enter the path to the directory containing your Metadata, Migrations and Seeds. If these are present in the root directory of the repository, you can skip this. + Enter the path to the directory containing your Metadata, Migrations + and Seeds. If these are present in the root directory of the + repository, you can skip this. handleChange(e)} - placeholder='e.g. hasura' + onChange={e => handleChange(e)} + placeholder="e.g. hasura" />
- + - Enter the repository branch the Hasura assets should be picked from. If you'd like to use the default branch of your repository, you can skip this. + Enter the repository branch the Hasura assets should be picked from. + If you'd like to use the default branch of your repository, you can + skip this. handleChange(e)} - placeholder='e.g. main' + onChange={e => handleChange(e)} + placeholder="e.g. main" />
-
- {isSubmitted &&

Awesome! We've copied this link to your clipboard for you 🎉

} +
+ {isSubmitted && ( +

Awesome! We've copied this link to your clipboard for you 🎉

+ )} {url}
@@ -119,7 +137,11 @@ const CloudDeployURLGenerationForm = () => { onClick={() => handleSubmit()} disabled={!isSubmittable} style={{ cursor: isSubmittable ? 'pointer' : 'not-allowed' }} - title={isSubmittable ? 'Click to submit' : 'Please fill out all required fields'} + title={ + isSubmittable + ? 'Click to submit' + : 'Please fill out all required fields' + } > Generate URL diff --git a/docs/src/components/HasuraReleaseNotification/styles.css b/docs/src/components/HasuraReleaseNotification/styles.css index 107b1c99119..fbacca67012 100644 --- a/docs/src/components/HasuraReleaseNotification/styles.css +++ b/docs/src/components/HasuraReleaseNotification/styles.css @@ -1,14 +1,14 @@ a.blue-dot { - position: relative; + position: relative; } .blue-dot::after { - content: ""; - position: absolute; - top: 3px; - right: 3px; - width: 8px; - height: 8px; - border-radius: 50%; - background-color: #0b89d0; -} \ No newline at end of file + content: ''; + position: absolute; + top: 3px; + right: 3px; + width: 8px; + height: 8px; + border-radius: 50%; + background-color: #0b89d0; +} diff --git a/docs/src/components/SampleAppBlock/index.jsx b/docs/src/components/SampleAppBlock/index.jsx index 31ffc87440a..78b9ef4a606 100644 --- a/docs/src/components/SampleAppBlock/index.jsx +++ b/docs/src/components/SampleAppBlock/index.jsx @@ -18,8 +18,15 @@ const SampleAppBlock = ({ dependent }) => (
DOCS E-COMMERCE SAMPLE APP

- - Deploy to Hasura Cloud + + Deploy to Hasura Cloud

); diff --git a/docs/src/plugins/docusaurus-plugin-google-gtm/index.js b/docs/src/plugins/docusaurus-plugin-google-gtm/index.js index f9868fcb7dd..f1bbe08d298 100644 --- a/docs/src/plugins/docusaurus-plugin-google-gtm/index.js +++ b/docs/src/plugins/docusaurus-plugin-google-gtm/index.js @@ -1,63 +1,57 @@ - const path = require('path'); - const { Joi } = require('@docusaurus/utils-validation'); +const path = require('path'); +const { Joi } = require('@docusaurus/utils-validation'); // import type { LoadContext, Plugin } from '@docusaurus/types'; // import type { PluginOptions } from './plugin-google-gtm'; - - function pluginGoogleGTM( - context, - options, - ) { - const { trackingID } = options; - const isProd = process.env.NODE_ENV === 'production'; - - return { - name: 'docusaurus-plugin-google-gtm', - - async contentLoaded({actions}) { - actions.setGlobalData(options); - }, - - injectHtmlTags() { - if (!isProd) return {}; - return { - headTags: [ - { - tagName: 'link', - attributes: { - rel: 'preconnect', - href: 'https://www.googletagmanager.com', - }, - }, - { - tagName: 'script', - innerHTML: `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': +function pluginGoogleGTM(context, options) { + const { trackingID } = options; + const isProd = process.env.NODE_ENV === 'production'; + + return { + name: 'docusaurus-plugin-google-gtm', + + async contentLoaded({ actions }) { + actions.setGlobalData(options); + }, + + injectHtmlTags() { + if (!isProd) return {}; + + return { + headTags: [ + { + tagName: 'link', + attributes: { + rel: 'preconnect', + href: 'https://www.googletagmanager.com', + }, + }, + { + tagName: 'script', + innerHTML: `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer', '${trackingID}');`, - }, - ], - preBodyTags: [ + }, + ], + preBodyTags: [ { tagName: 'noscript', innerHTML: ``, }, - ], - }; - }, - }; - } + ], + }; + }, + }; +} - const pluginOptionsSchema = Joi.object({ +const pluginOptionsSchema = Joi.object({ trackingID: Joi.string().required(), }); -pluginGoogleGTM.validateOptions = function ({ - validate, - options, -}) { +pluginGoogleGTM.validateOptions = function ({ validate, options }) { return validate(pluginOptionsSchema, options); -} - - module.exports = pluginGoogleGTM \ No newline at end of file +}; + +module.exports = pluginGoogleGTM; diff --git a/docs/src/plugins/docusaurus-plugin-segment-analytics/index.js b/docs/src/plugins/docusaurus-plugin-segment-analytics/index.js index 9949869fe91..fe30e44c05a 100644 --- a/docs/src/plugins/docusaurus-plugin-segment-analytics/index.js +++ b/docs/src/plugins/docusaurus-plugin-segment-analytics/index.js @@ -1,65 +1,59 @@ - const path = require('path'); - const { Joi } = require('@docusaurus/utils-validation'); +const path = require('path'); +const { Joi } = require('@docusaurus/utils-validation'); // import type { LoadContext, Plugin } from '@docusaurus/types'; // import type { PluginOptions } from './plugin-segment-analytics'; - - function pluginSegmentAnalitics( - context, - options, - ) { - const { prodKey, devKey, trackPage } = options; - const isProd = process.env.NODE_ENV === 'production'; - const writeKey = isProd ? prodKey : devKey; - - return { - name: 'docusaurus-plugin-segment-analytics', - - async contentLoaded({actions}) { - actions.setGlobalData(options); - }, - - getClientModules() { - return [path.resolve(__dirname, './segmentAnalytics')]; - }, - - injectHtmlTags() { - if (!isProd) return {}; - return { - headTags: [ - { - tagName: 'link', - attributes: { - rel: 'preconnect', - href: 'https://cdn.segment.com', - }, - }, - { - tagName: 'script', - innerHTML: ` +function pluginSegmentAnalitics(context, options) { + const { prodKey, devKey, trackPage } = options; + const isProd = process.env.NODE_ENV === 'production'; + const writeKey = isProd ? prodKey : devKey; + + return { + name: 'docusaurus-plugin-segment-analytics', + + async contentLoaded({ actions }) { + actions.setGlobalData(options); + }, + + getClientModules() { + return [path.resolve(__dirname, './segmentAnalytics')]; + }, + + injectHtmlTags() { + if (!isProd) return {}; + + return { + headTags: [ + { + tagName: 'link', + attributes: { + rel: 'preconnect', + href: 'https://cdn.segment.com', + }, + }, + { + tagName: 'script', + innerHTML: ` !function(){var analytics=window.analytics=window.analytics||[];if(!analytics.initialize)if(analytics.invoked)window.console&&console.error&&console.error("Segment snippet included twice.");else{analytics.invoked=!0;analytics.methods=["trackSubmit","trackClick","trackLink","trackForm","pageview","identify","reset","group","track","ready","alias","debug","page","once","off","on","addSourceMiddleware","addIntegrationMiddleware","setAnonymousId","addDestinationMiddleware"];analytics.factory=function(e){return function(){var t=Array.prototype.slice.call(arguments);t.unshift(e);analytics.push(t);return analytics}};for(var e=0;e +
); } -function EditMetaRow({ editUrl, lastUpdatedAt, lastUpdatedBy, formattedLastUpdatedAt }) { +function EditMetaRow({ + editUrl, + lastUpdatedAt, + lastUpdatedBy, + formattedLastUpdatedAt, +}) { return (
{editUrl && }
@@ -36,7 +46,13 @@ function EditMetaRow({ editUrl, lastUpdatedAt, lastUpdatedBy, formattedLastUpdat } export default function DocItemFooter() { const { metadata } = useDoc(); - const { editUrl, lastUpdatedAt, formattedLastUpdatedAt, lastUpdatedBy, tags } = metadata; + const { + editUrl, + lastUpdatedAt, + formattedLastUpdatedAt, + lastUpdatedBy, + tags, + } = metadata; const canDisplayTagsRow = tags.length > 0; const canDisplayEditMetaRow = !!(editUrl || lastUpdatedAt || lastUpdatedBy); const canDisplayFooter = canDisplayTagsRow || canDisplayEditMetaRow; @@ -45,9 +61,11 @@ export default function DocItemFooter() { } return ( <> - - -