How to use react-fetching-library - 10 common examples

To help you get started, we’ve selected a few react-fetching-library examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github marcin-piela / react-fetching-library / examples / query-facc / src / api / Client.ts View on Github external
import { createClient } from 'react-fetching-library';

import { requestHostInterceptor } from './requestInterceptors/requestHostInterceptor';

// In real application this const will be stored in ENV's
const HOST = 'https://private-34f3a-reactapiclient.apiary-mock.com';

export const Client = createClient({
  requestInterceptors: [requestHostInterceptor(HOST)],
});
github marcin-piela / react-fetching-library / examples / client-context / src / api / Client.ts View on Github external
import { createClient } from 'react-fetching-library';

import { requestHostInterceptor } from './requestInterceptors/requestHostInterceptor';

// In real application this const will be stored in ENV's
const HOST = 'https://private-34f3a-reactapiclient.apiary-mock.com';

export const Client = createClient({
  requestInterceptors: [requestHostInterceptor(HOST)],
});
github marcin-piela / react-fetching-library / examples / cache-provider / src / api / Client.ts View on Github external
import { requestHostInterceptor } from './requestInterceptors/requestHostInterceptor';

// In real application this const will be stored in ENV's
const HOST = 'https://private-34f3a-reactapiclient.apiary-mock.com';

const cache = createCache>(
  (action: Action) => {
    return action.method === 'GET';
  },
  (response: QueryResponse & { timestamp: number }) => {
    return new Date().getTime() - response.timestamp < 10000;
  },
);

export const Client = createClient({
  requestInterceptors: [requestHostInterceptor(HOST)],
  cacheProvider: cache,
});
github marcin-piela / react-fetching-library / examples / use-query-hook / src / api / Client.ts View on Github external
import { createClient } from 'react-fetching-library';

import { requestHostInterceptor } from './requestInterceptors/requestHostInterceptor';

// In real application this const will be stored in ENV's
const HOST = 'https://private-34f3a-reactapiclient.apiary-mock.com';

export const Client = createClient({
  requestInterceptors: [requestHostInterceptor(HOST)],
});
github marcin-piela / react-fetching-library / examples / use-suspense-query-hook / src / api / Client.ts View on Github external
import { createClient } from 'react-fetching-library';

import { requestHostInterceptor } from './requestInterceptors/requestHostInterceptor';

// In real application this const will be stored in ENV's
const HOST = 'https://private-34f3a-reactapiclient.apiary-mock.com';

export const Client = createClient({
  requestInterceptors: [requestHostInterceptor(HOST)],
});
github Azure-Samples / azure-intelligent-edge-patterns / edge-ai-void-detection / modules / apiserver / src / RetailDemo.Web.UI / ClientApp / src / api / FetchComponents / fetchClient.jsx View on Github external
import { createClient } from 'react-fetching-library';
import { requestHostInterceptor } from '../../api/FetchComponents/requestHostInterceptor';

// Import app settings
import { apiUrl } from '../../app/App.settings.jsx';

const endpointUrl = localStorage.getItem("endpointUrl");

export const client = createClient({
    requestInterceptors: [requestHostInterceptor(endpointUrl)],
});
github marcin-piela / react-fetching-library / examples / cache-provider / src / api / Client.ts View on Github external
import { createClient, createCache, QueryResponse, Action } from 'react-fetching-library';

import { requestHostInterceptor } from './requestInterceptors/requestHostInterceptor';

// In real application this const will be stored in ENV's
const HOST = 'https://private-34f3a-reactapiclient.apiary-mock.com';

const cache = createCache>(
  (action: Action) => {
    return action.method === 'GET';
  },
  (response: QueryResponse & { timestamp: number }) => {
    return new Date().getTime() - response.timestamp < 10000;
  },
);

export const Client = createClient({
  requestInterceptors: [requestHostInterceptor(HOST)],
  cacheProvider: cache,
});
github marcin-piela / react-fetching-library / examples / ssr-nextjs / api / client.js View on Github external
import { createClient } from 'react-fetching-library';
import { cache } from './cache';

const client = createClient({
  cacheProvider: cache,
});

export default client;
github Azure-Samples / azure-intelligent-edge-patterns / edge-ai-void-detection / modules / apiserver / src / RetailDemo.Web.UI / ClientApp / src / api / DataContainers / imageEventsContainer.jsx View on Github external
export const imageEventsContainer = (edgeDevice) => {
    //const { edgeDevice} = props;

    const { loading, payload, error, query } = useQuery(fetchImageEvents(edgeDevice), false);

    let isLoading = loading;
    const isError = error;
    const reload = query;

    if (payload === undefined) isLoading = true;

    let capturetime = "";
    let imgSrc = "";
    let newOutOfStockItems = 0;

    if (payload !== undefined) {
        imgSrc = payload.body.dest_img;
        newOutOfStockItems = payload.body.result.num_detections;
        capturetime = payload.capturetime;
    }
github marcin-piela / react-fetching-library / examples / ssr-nextjs / pages / index.js View on Github external
const Users = () => {
  const { loading, payload, error, query } = useQuery(action, true);

  return (
    <div>
      {loading &amp;&amp; <span>Loading</span>}

      {error &amp;&amp; <span>Error</span>}

      {!loading &amp;&amp;
        payload &amp;&amp;
        payload.map((user, index) =&gt; (
          <span>
            {index + 1} - {user.firstName} <br>
            <br>
          </span>
        ))}
</div>

react-fetching-library

Simple and powerful API client for react. Use hooks or FACC's to fetch data in easy way. No dependencies! Just react under the hood.

MIT
Latest version published 4 years ago

Package Health Score

53 / 100
Full package analysis