KATT

Disclaimer - I'm a massive GraphQL-fan and been building APIs and React-apps with (in production) since 2016. All the criticism below are specifically to do with Hasura and not GraphQL itself.

Explicit types

i have an app that has a type of product listings where something like "price" is optional but price consists of several fields (amount, currency [and more that are irrelevant for this point]) so in the db they all have to be nullable, which is fine, but they are always presented as a group typically, as a consumer you'd want a nullable price: Price but i end up having to write custom client logic that I thought I was done with since starting making backends in graphql 4-5 years ago

KATT

{
  
}

KATT

name: Cypress

on: [push]

jobs:
  build:
    runs-on: ubuntu-latest
    timeout-minutes: 20

    services:

KATT

// usage examples

// callback
const err1 = await waitError(() => { /* do something that throws */ })

// async callback
const err2 = await waitError(async () => { /* do something async that throws */ })

// expect a promise instance to throw
const err3 = await waitError(promise) 

KATT

I made a mini library out of this, have a look att github.com/KATT/next-router-query

KATT

import React, { Component, ErrorInfo, ReactNode } from 'react';
import NextError from 'next/error';
import { TRPCClientErrorLike } from '@trpc/client';
import { AppRouter } from 'server/routers/_app';

interface Props {
  children: ReactNode;
}

interface State {

KATT

import { z } from 'zod';
import { TRPCError } from '@trpc/server';

/**
 * Output parser. Example use-cases:
 * - Resolvers where you touch sensitive data that you don't wanna risk leaking
 * - Hairy resolvers where it's hard to follow what the resolver returns
 * @param schema Zod Schema
 * @param output The output
 * @returns A parsed output, guaranteed to conform to the schema

KATT

import { useEffect, useState } from 'react';

/**
 * Use the last value that isn't `null` or `undefined`.
 * Useful for instance in modals where you don't want the selected item to flicker when the modal is closed.
 */
export function useLastNonNullableValue<T>(currentValue: T) {
  const [value, setValue] = useState(currentValue);
  useEffect(() => {
    setValue((stored) => currentValue ?? stored);

KATT

import {
  createReactQueryHooks,
  TRPCClientErrorLike,
  UseTRPCMutationOptions,
  UseTRPCQueryOptions,
} from '@trpc/react';
import type { inferProcedureInput, inferProcedureOutput } from '@trpc/server';
import { NextPageContext } from 'next';
// ℹ️ Type-only import:
// https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-8.html#type-only-imports-and-export

KATT

/**
 * @link https://raw.githubusercontent.com/NaturalCycles/js-lib/master/src/promise/pProps.ts
 * Promise.all for Object instead of Array.
 *
 * Inspired by Bluebird Promise.props() and https://github.com/sindresorhus/p-props
 *
 * Improvements:
 *
 * - Exported as { promiseProps }, so IDE auto-completion works