<repo_name>manifoldfinance/metamask-links<file_sep>/src/helpers/openrpcDocumentToJSONRPCSchema.ts
import {
  MethodObject,
  ContentDescriptorObject,
  OpenrpcDocument,
  ExampleObject,
} from '@open-rpc/meta-schema';

const schema: any = {
  type: 'object',
  properties: {
    jsonrpc: {
      type: 'string',
      enum: ['2.0'],
      description: 'JSON-RPC version string',
    },
    id: {
      description: 'unique identifier for the JSON-RPC request',
      oneOf: [
        {
          type: 'string',
        },
        {
          type: 'number',
        },
      ],
    },
    method: {
      type: 'string',
    },
  },
};

const openrpcDocumentToJSONRPCSchema = (openrpcDocument: OpenrpcDocument) => {
  return {
    type: 'object',
    properties: {
      id: {
        ...schema.properties.id,
      },
      jsonrpc: {
        ...schema.properties.jsonrpc,
      },
      method: {
        type: 'string',
        oneOf: openrpcDocument?.methods?.map(_method => {
          const method = _method as MethodObject;
          return {
            const: method.name,
            description: method.description || method.summary,
            markdownDescription: method.description || method.summary,
          };
        }),
      },
    },
    allOf: openrpcDocument?.methods?.map(_method => {
      const method = _method as MethodObject;
      return {
        if: {
          properties: {
            method: {
              const: method.name,
            },
          },
        },
        then: {
          properties: {
            params: {
              oneOf: [
                {
                  type: 'array',
                  minItems: method?.params?.filter(
                    (param: any) => param.required,
                  ).length,
                  maxItems: method?.params?.length,
                  defaultSnippets: method.examples
                    ? method.examples.map((example: any) => {
                        return {
                          label: example.name,
                          description: example.description || example.summary,
                          body: example.params?.map(
                            (ex: ExampleObject) => ex.value,
                          ),
                        };
                      })
                    : [],
                  items: method.params?.map((param: any) => {
                    return {
                      ...param.schema,
                      markdownDescription: param.description || param.summary,
                      description: param.description || param.summary,
                      additionalProperties: false,
                    };
                  }),
                },
                {
                  type: 'object',
                  properties:
                    method.params &&
                    (method.params as ContentDescriptorObject[]).reduce(
                      (memo: any, param: ContentDescriptorObject) => {
                        if (typeof param.schema === 'object') {
                          memo[param.name] = {
                            ...param.schema,
                            markdownDescription:
                              param.description || param.summary,
                            description: param.description || param.summary,
                            additionalProperties: false,
                          };
                        } else {
                          memo[param.name] = param.schema;
                        }
                        return memo;
                      },
                      {},
                    ),
                },
              ],
            },
          },
        },
      };
    }),
  };
};

export default openrpcDocumentToJSONRPCSchema;
<file_sep>/gatsby-config.js
module.exports = {
  pathPrefix: '/metamask-link',
  siteMetadata: {
    title: 'MetaMask Link',
    description: 'This tool lets you link to metamask actions.',
    logoUrl:
      'https://raw.githubusercontent.com/MetaMask/brand-resources/master/SVG/metamask-fox.svg',
    author: '',
  },
  plugins: [
    'gatsby-theme-material-ui',
    {
      resolve: 'gatsby-plugin-manifest',
      options: {
        name: 'metamask-link',
        short_name: 'metamask-link',
        start_url: '/',
        background_color: 'transparent',
        theme_color: '#3f51b5',
        display: 'minimal-ui',
        icon: 'src/images/metamask-fox.svg', // This path is relative to the root of the site.
      },
    },
  ],
};
<file_sep>/setup.sh
#!/bin/sh
yarn install --pure-lockfile --ignore-scripts
cd node_modules/sharp/
yarn
yarn run install
cd -
yarn run build
<file_sep>/src/hooks/useQueryString.ts
/* eslint-disable consistent-return */
import { useState } from 'react';
import * as qs from 'qs';

const useQueryParams = (search: string, depth?: number) => {
  const parse = (): any => {
    return qs.parse(search, {
      ignoreQueryPrefix: true,
      depth: depth || 100,
      decoder(str: string) {
        if (/^([+-]?[0-9]\d*|0)$/u.test(str)) {
          return parseInt(str, 10);
        }
        if (str === 'false') {
          return false;
        }
        if (str === 'true') {
          return true;
        }
        return decodeURIComponent(str);
      },
    });
  };
  const [query] = useState(parse());
  return [query];
};

export default useQueryParams;
<file_sep>/README.md
# MetaMask Link

Create deep links for MetaMask confirmations - including adding custom networks, tokens, payment requests, and more. It uses the `window.ethereum` provider under the hood.
