Aws-mobile-appsync-sdk-js: REST wrapper

[jmparsons]

Is there a way to designate a portion of calls to be wrapped?

I'm trying to get rid of redux entirely (not completely considering the project uses redux-offline), but ideally it would be nice to run Apollo for everything ui. If I have a one off REST call, can I wrap it somehow with something along the lines of https://github.com/apollographql/apollo-link-rest/ without having to create another client and or link?

[undefobj]

Hi - We use redux-offline as an implementation for customers that wish to have offline capabilities in their applications, however we released a package recently where this is now optional: https://github.com/awslabs/aws-mobile-appsync-sdk-js/pull/33

Are you trying to do a specific one-off HTTP call to an AWS service other than AppSync? If so one option might be to use the API category of AWS Amplify: https://github.com/aws/aws-amplify/blob/master/docs/media/api_guide.md

Since you can use Amplify + AppSync together it would simply be importing the API category into your AppSync project and then using it for your one-off call.

[jmparsons]

It's a third party api, like get stock prices. I'll come back to it. Seems converting everything to a graphql query with redux offline proxy just complicates things when I just need an updated price ticker available in multiple components. I didn't want to wrap the call in a lambda and convert it because this call happens very frequently, and my lambda would only be changing the presentation of data - could be expensive.

[jmparsons]

I was able to use withApollo wrapping a fetch call then converted it to a client writeQuery with typeName. It's a bit of a hack, but sufficient for now.

[manueliglesias]

Once PR #96 gets merged, it should be possible to use apollo-link-state with the AWS AppSync client like this:

import { RestLink } from "apollo-link-rest";
import { ApolloLink } from 'apollo-link';
import AWSAppSyncClient, { createAppSyncLink } from "aws-appsync";

const restLink = new RestLink({
  uri: 'https://geocode.xyz/',
  typePatcher: {
    City: (data) => {
      if (data.standard != null) {
        data.standard = { __typename: "CityInfo", ...data.standard };
      }
      return data;
    }
  }
});

const appSyncLink = createAppSyncLink({
  url: appSyncConfig.graphqlEndpoint,
  region: appSyncConfig.region,
  auth: {
    type: appSyncConfig.authenticationType,
    apiKey: appSyncConfig.apiKey
  }
});

const link = ApolloLink.from([
  restLink,
  appSyncLink
]);

const client = new AWSAppSyncClient({}, { link });

const query = gql`
  query myQuery($name: String) {
    city(name: $name) @rest(type: "City", path: ":name?geoit=json") {
      latt,
      longt,
      standard {
        addresst
        city
        countryname
      }
    }
  }
`;

client.query({ query, variables: { name: 'Ciudad Juarez, Chihuahua' } }).then(response => {
  console.log(response.data.city);
});

/*
{
    "latt": "28.69792",
    "longt": "-106.10833",
    "standard": {
        "addresst": "Ciudad Juarez",
        "city": "Chihuahua",
        "countryname": "Mexico",
        "__typename": "CityInfo"
    },
    "__typename": "City"
}
*/

[jmparsons]

@manueliglesias This is exactly what I was looking for! Much appreciated!