deep-foundation / react-hasura

The Unlicense
7 stars 2 forks source link

ApolloClientTokenizedProvider does not pass token down #3

Closed FreePhoenix888 closed 1 year ago

FreePhoenix888 commented 1 year ago

Describe the bug

Code

import {
  CapacitorStoreProvider,
} from "@deep-foundation/store/capacitor.js";
import { ChakraProvider, Text } from "@chakra-ui/react";
import { ApolloClientTokenizedProvider } from "@deep-foundation/react-hasura/apollo-client-tokenized-provider";
import { TokenProvider, useTokenController } from "@deep-foundation/deeplinks/imports/react-token.js";
import {
  DeepProvider,
  useDeep,
} from "@deep-foundation/deeplinks/imports/client.js";
import { LocalStoreProvider } from "@deep-foundation/store/local.js";
import { CookiesStoreProvider } from "@deep-foundation/store/cookies.js";
import { QueryStoreProvider } from "@deep-foundation/store/query.js";
import { useEffect } from "react";

export default function TestPage() {
  return (
    <ChakraProvider>
      <CapacitorStoreProvider>
        <QueryStoreProvider>
          <CookiesStoreProvider>
            <LocalStoreProvider>
              <TokenProvider>
                <ApolloClientTokenizedProvider
                  options={{
                    client: "@deep-foundation/sdk",
                    path: myGqlPath,
                    ssl: true,
                    token:
                      myToken,
                    ws: !!process?.browser,
                  }}
                >
                  <DeepProvider>{<Content />}</DeepProvider>
                </ApolloClientTokenizedProvider>
              </TokenProvider>
            </LocalStoreProvider>
          </CookiesStoreProvider>
        </QueryStoreProvider>
      </CapacitorStoreProvider>
    </ChakraProvider>
  );
}

export function Content() {
  const deep = useDeep();

  return <Text>Deep link id:{deep?.linkId!}</Text>;
}

Additional Info

Note that I am sure that token and gqlPath are correct. I have console.log'ged them and I have passed values directly - but behavior is the same

Expected Behavior

token and path are passed to ApolloClientTokenizedProvider and deep.token, deep.apolloClient.token, deep.apolloClient.jwt_token, deep.apolloClient.path are set correctly

Current Behavior

token and path are passed to ApolloClientTokenizedProvider but deep.token, deep.apolloClient.token, deep.apolloClient.jwt_token are undefined while deep.apolloClient.path is set correctly

Steps to reproduce

No response

Environment

## System:
 - OS: Linux 5.15 Ubuntu 22.04.3 LTS 22.04.3 LTS (Jammy Jellyfish)
 - CPU: (12) x64 AMD Ryzen 5 2600 Six-Core Processor
 - Memory: 3.64 GB / 7.73 GB
 - Container: Yes
 - Shell: 5.1.16 - /bin/bash
## npmPackages:
 - @capacitor-community/contacts: ^5.0.3 => 5.0.3 
 - @capacitor-community/electron: ^4.1.2 => 4.1.2 
 - @capacitor/action-sheet: ^5.0.0 => 5.0.4 
 - @capacitor/android: ^5.0.0 => 5.0.5 
 - @capacitor/camera: ^5.0.0 => 5.0.4 
 - @capacitor/cli: ^5.0.0 => 5.0.5 
 - @capacitor/clipboard: ^5.0.0 => 5.0.4 
 - @capacitor/core: ^5.0.0 => 5.0.5 
 - @capacitor/device: ^5.0.0 => 5.0.4 
 - @capacitor/dialog: ^5.0.0 => 5.0.4 
 - @capacitor/geolocation: ^5.0.0 => 5.0.4 
 - @capacitor/haptics: ^5.0.0 => 5.0.4 
 - @capacitor/ios: ^5.0.0 => 5.0.5 
 - @capacitor/local-notifications: ^5.0.0 => 5.0.4 
 - @capacitor/motion: ^5.0.0 => 5.0.4 
 - @capacitor/network: ^5.0.0 => 5.0.6 
 - @capacitor/push-notifications: ^5.0.0 => 5.0.4 
 - @capacitor/screen-reader: ^5.0.0 => 5.0.4 
 - @capawesome/capacitor-file-picker: ^5.0.0 => 5.0.0 
 - @chakra-ui/react: ^2.5.5 => 2.7.1 
 - @deep-foundation/capacitor-camera: ^1.1.7 => 1.1.7 
 - @deep-foundation/capacitor-device: ^17.0.3 => 17.0.3 
 - @deep-foundation/capacitor-motion: ^6.0.0 => 6.0.0 
 - @deep-foundation/capacitor-network: ^0.1.4 => 0.1.4 
 - @deep-foundation/capacitor-voice-recorder: ^1.2.1 => 1.2.1 
 - @deep-foundation/deeplinks: ^0.0.278 => 0.0.278 
 - @deep-foundation/firebase-push-notification: ^18.2.0 => 18.2.1 
 - @deep-foundation/react-with-packages-installed: ^0.5.3 => 0.5.3 
 - @deep-foundation/store: ^0.0.19 => 0.0.19 
 - @emotion/react: ^11.10.6 => 11.11.1 
 - @emotion/styled: ^11.10.6 => 11.11.0 
 - @freephoenix888/deep-map-object: ^3.0.1 => 3.0.1 
 - @google-cloud/speech: ^5.4.0 => 5.5.0 
 - @google-cloud/vision: ^3.1.2 => 3.1.3 
 - @ionic/pwa-elements: ^3.2.2 => 3.2.2 
 - @kevincobain2000/json-to-html-table: ^1.0.4 => 1.0.4 
 - @octokit/rest: ^19.0.5 => 19.0.13 
 - @rjsf/chakra-ui: ^5.6.2 => 5.8.1 
 - @rjsf/core: ^5.6.2 => 5.8.1 
 - @rjsf/utils: ^5.6.2 => 5.8.1 
 - @rjsf/validator-ajv8: ^5.6.2 => 5.8.1 
 - @types/debug: ^4.1.8 => 4.1.8 
 - @types/hjson: ^2.4.3 => 2.4.3 
 - @types/react: ^18.0.33 => 18.2.15 
 - @types/serviceworker: ^0.0.62 => 0.0.62 
 - atob: ^2.1.2 => 2.1.2 
 - az: ^0.2.3 => 0.2.3 
 - buffer: ^6.0.3 => 6.0.3 
 - capacitor-voice-recorder: ^5.0.0 => 5.0.0 
 - case-anything: ^2.1.13 => 2.1.13 
 - dotenv: ^16.0.3 => 16.3.1 
 - dotenv-load: ^2.0.1 => 2.0.1 
 - events: ^3.3.0 => 3.3.0 
 - firebase: ^9.19.1 => 9.22.2 
 - framer-motion: ^6.5.1 => 6.5.1 
 - generate-schema: ^2.6.0 => 2.6.0 
 - hjson: ^3.2.2 => 3.2.2 
 - jest: ^29.5.0 => 29.5.0 
 - next: ^13.4.7 => 13.4.7 
 - next-env: ^1.1.1 => 1.1.1 
 - next-pwa: ^5.6.0 => 5.6.0 
 - next-transpile-modules: ^10.0.0 => 10.0.0 
 - react: ^18.2.0 => 18.2.0 
 - react-dom: ^18.2.0 => 18.2.0 
 - react-json-to-table: ^0.1.7 => 0.1.7 
 - react-json-view-lite: ^0.9.8 => 0.9.8 
 - ts-node: ^10.9.1 => 10.9.1 
 - typescript: 5.0.4 => 5.0.4 
 - typescript-json-schema: ^0.56.0 => 0.56.0 
 - uuid: ^9.0.0 => 9.0.0 
 - yargs: ^17.7.2 => 17.7.2
FreePhoenix888 commented 1 year ago

Working code:

import { ChakraProvider } from "@chakra-ui/react";
import { DeepProvider } from "@deep-foundation/deeplinks/imports/client";
import { TokenProvider } from "@deep-foundation/deeplinks/imports/react-token";
import { ApolloClientTokenizedProvider } from '@deep-foundation/react-hasura/apollo-client-tokenized-provider';
import { LocalStoreProvider } from "@deep-foundation/store/local";
import { CapacitorStoreProvider } from "@deep-foundation/store/capacitor";
import { CookiesStoreProvider } from "@deep-foundation/store/cookies";
import { QueryStoreProvider } from "@deep-foundation/store/query";

export function WithProviders({ children }: { children: JSX.Element }) {

  return (
    <ChakraProvider>
      <CapacitorStoreProvider>
        <QueryStoreProvider>
          <CookiesStoreProvider>
            <LocalStoreProvider>
              <TokenProvider>
                <ApolloClientTokenizedProvider
                  options={{
                    client: "@deep-foundation/deep-memo-app",
                    path: MY_GRAPHQL_PATH,
                    ssl: true,
                    token: MY_TOKEN,
                    ws: !!process?.browser,
                  }}
                >
                  <DeepProvider>{children}</DeepProvider>
                </ApolloClientTokenizedProvider>
              </TokenProvider>
            </LocalStoreProvider>
          </CookiesStoreProvider>
        </QueryStoreProvider>
      </CapacitorStoreProvider>
    </ChakraProvider>
  );
}