Fix code style (#13)

* Fixed prettier configuration

* Updated dependencies, fixed some scripts

* Reformatted all code

.prettierrc

@@ -1,6 +1,13 @@
 {
-    "jsxSingleQuote": false,
-    "jsxBracketSameLine": false,
+    "endOfLine": "auto",
     "tabWidth": 4,
-    "singleQuote": true
+    "printWidth": 120,
+    "trailingComma": "all",
+    "singleQuote": true,
+    "useTabs": false,
+    "arrowParens": "always",
+    "bracketSameLine": false,
+    "bracketSpacing": true,
+    "embeddedLanguageFormatting": "auto",
+    "jsxSingleQuote": false
 }

README.md

@@ -1 +1 @@
-"# react-suspended-query" 
+"# react-suspended-query"

aqu.config.js

@@ -1,45 +1,45 @@
-var nodeResolve = require('@esbuild-plugins/node-resolve').default;
-
-/** @type {import('esbuild').Plugin} */
-var excludeCrypto = {
-    name: 'exclude-crypto',
-    setup: (build) => {
-        build.onResolve({ filter: /crypto/ }, (arguments_) => ({
-            path: arguments_.path,
-            namespace: 'crypto',
-        }));
-
-        build.onLoad({ filter: /crypto/, namespace: 'crypto' }, () => ({
-            contents: JSON.stringify({}),
-            loader: 'json',
-        }));
-    },
-};
-
-var nodeResolveExternal = nodeResolve({
-    extensions: ['.ts', '.js', '.tsx', '.jsx', '.cjs', '.mjs'],
-    onResolved: (resolved) => {
-        if (resolved.includes('object-hash')) {
-            return resolved;
-        }
-
-        if (resolved.includes('node_modules')) {
-            return {
-                external: true,
-            };
-        }
-        return resolved;
-    },
-});
-
-module.exports = {
-    buildOptions: {
-        plugins: [nodeResolveExternal, excludeCrypto],
-    },
-    dtsBundleGeneratorOptions: {
-        libraries: {
-            importedLibraries: ['react', '@sirse-dev/safe-context'],
-            allowedTypesLibraries: [],
-        },
-    },
-};
+var nodeResolve = require('@esbuild-plugins/node-resolve').default;
+
+/** @type {import('esbuild').Plugin} */
+var excludeCrypto = {
+    name: 'exclude-crypto',
+    setup: (build) => {
+        build.onResolve({ filter: /crypto/ }, (arguments_) => ({
+            path: arguments_.path,
+            namespace: 'crypto',
+        }));
+
+        build.onLoad({ filter: /crypto/, namespace: 'crypto' }, () => ({
+            contents: JSON.stringify({}),
+            loader: 'json',
+        }));
+    },
+};
+
+var nodeResolveExternal = nodeResolve({
+    extensions: ['.ts', '.js', '.tsx', '.jsx', '.cjs', '.mjs'],
+    onResolved: (resolved) => {
+        if (resolved.includes('object-hash')) {
+            return resolved;
+        }
+
+        if (resolved.includes('node_modules')) {
+            return {
+                external: true,
+            };
+        }
+        return resolved;
+    },
+});
+
+module.exports = {
+    buildOptions: {
+        plugins: [nodeResolveExternal, excludeCrypto],
+    },
+    dtsBundleGeneratorOptions: {
+        libraries: {
+            importedLibraries: ['react', '@sirse-dev/safe-context'],
+            allowedTypesLibraries: [],
+        },
+    },
+};

example/src/App.tsx

@@ -1,21 +1,21 @@
-import React, { useState } from 'react';
-import { ErrorBoundary } from './ErrorBoundary';
-import { MyForm } from './MyForm';
-
-export const App = () => {
-    const [state, setState] = useState(true);
-
-    return (
-        <ErrorBoundary fallback={<div>Error has occured</div>}>
-            {state && <MyForm />}
-
-            <button
-                onClick={() => {
-                    setState((old) => !old);
-                }}
-            >
-                toggle state
-            </button>
-        </ErrorBoundary>
-    );
-};
+import React, { useState } from 'react';
+import { ErrorBoundary } from './ErrorBoundary';
+import { MyForm } from './MyForm';
+
+export const App = () => {
+    const [state, setState] = useState(true);
+
+    return (
+        <ErrorBoundary fallback={<div>Error has occured</div>}>
+            {state && <MyForm />}
+
+            <button
+                onClick={() => {
+                    setState((old) => !old);
+                }}
+            >
+                toggle state
+            </button>
+        </ErrorBoundary>
+    );
+};

example/src/ErrorBoundary.tsx

@@ -1,30 +1,30 @@
-import React, { Component, PropsWithChildren } from 'react';
-
-export type ErrorBoundaryProps = PropsWithChildren<{
-    fallback: React.ReactNode;
-}>;
-
-type ErrorBoundaryState = {
-    hasError: boolean;
-};
-
-export class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
-    constructor(props: ErrorBoundaryProps) {
-        super(props);
-        this.state = { hasError: false };
-    }
-
-    static getDerivedStateFromError() {
-        return { hasError: true };
-    }
-
-    render() {
-        const { children, fallback } = this.props;
-
-        if (this.state.hasError) {
-            return fallback;
-        }
-
-        return children;
-    }
-}
+import React, { Component, PropsWithChildren } from 'react';
+
+export type ErrorBoundaryProps = PropsWithChildren<{
+    fallback: React.ReactNode;
+}>;
+
+type ErrorBoundaryState = {
+    hasError: boolean;
+};
+
+export class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
+    constructor(props: ErrorBoundaryProps) {
+        super(props);
+        this.state = { hasError: false };
+    }
+
+    static getDerivedStateFromError() {
+        return { hasError: true };
+    }
+
+    render() {
+        const { children, fallback } = this.props;
+
+        if (this.state.hasError) {
+            return fallback;
+        }
+
+        return children;
+    }
+}

example/src/MyForm.tsx

@@ -1,47 +1,47 @@
-import { Suspense } from 'react';
-import { createCacheGroup, QueryCacheProvider, useQuery } from 'react-suspended-query';
-import { globalCache } from '.';
-
-const localCache = createCacheGroup();
-
-const _MyForm = () => {
-    const data = useQuery(
-        'api/local',
-        async () => {
-            console.log('Fetching local data...');
-            await new Promise((resolve) => setTimeout(resolve, 1000));
-            // Await new Promise((resolve, reject) => {
-            //     Reject('asdf');
-            // });
-            return 'local data';
-        },
-        localCache,
-    );
-
-    const global = useQuery(
-        'api/global',
-        async () => {
-            console.log('Fetching global data...');
-            await new Promise((resolve) => setTimeout(resolve, 1000));
-            return 'global data';
-        },
-        globalCache,
-    );
-
-    return (
-        <div>
-            <div>{data}</div>
-            <div>{global}</div>
-        </div>
-    );
-};
-
-export const MyForm = () => {
-    return (
-        <QueryCacheProvider cacheGroup={localCache}>
-            <Suspense fallback={<div>Loading...</div>}>
-                <_MyForm />
-            </Suspense>
-        </QueryCacheProvider>
-    );
-};
+import { Suspense } from 'react';
+import { createCacheGroup, QueryCacheProvider, useQuery } from 'react-suspended-query';
+import { globalCache } from '.';
+
+const localCache = createCacheGroup();
+
+const _MyForm = () => {
+    const data = useQuery(
+        'api/local',
+        async () => {
+            console.log('Fetching local data...');
+            await new Promise((resolve) => setTimeout(resolve, 1000));
+            // Await new Promise((resolve, reject) => {
+            //     Reject('asdf');
+            // });
+            return 'local data';
+        },
+        localCache,
+    );
+
+    const global = useQuery(
+        'api/global',
+        async () => {
+            console.log('Fetching global data...');
+            await new Promise((resolve) => setTimeout(resolve, 1000));
+            return 'global data';
+        },
+        globalCache,
+    );
+
+    return (
+        <div>
+            <div>{data}</div>
+            <div>{global}</div>
+        </div>
+    );
+};
+
+export const MyForm = () => {
+    return (
+        <QueryCacheProvider cacheGroup={localCache}>
+            <Suspense fallback={<div>Loading...</div>}>
+                <_MyForm />
+            </Suspense>
+        </QueryCacheProvider>
+    );
+};

example/src/index.tsx

@@ -1,15 +1,15 @@
-import { createRoot } from 'react-dom/client';
-import { QueryCacheProvider, createCacheGroup } from 'react-suspended-query';
-import { App } from './App';
-
-const container = document.querySelector('#root');
-
-const root = createRoot(container as HTMLElement);
-
-export const globalCache = createCacheGroup();
-
-root.render(
-    <QueryCacheProvider cacheGroup={globalCache}>
-        <App />
-    </QueryCacheProvider>,
-);
+import { createRoot } from 'react-dom/client';
+import { QueryCacheProvider, createCacheGroup } from 'react-suspended-query';
+import { App } from './App';
+
+const container = document.querySelector('#root');
+
+const root = createRoot(container as HTMLElement);
+
+export const globalCache = createCacheGroup();
+
+root.render(
+    <QueryCacheProvider cacheGroup={globalCache}>
+        <App />
+    </QueryCacheProvider>,
+);