How to use the relay-hooks.useRelayEnvironment function in relay-hooks

To help you get started, we’ve selected a few relay-hooks 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 morrys / offline-examples / relay / nextjs / components / Todo.tsx View on Github external
export const Todo = (props: Props) => {
  const [isEditing, setIsEditing] = useState(false);

  const {disabled} = props;
  const environment = useRelayEnvironment();
  const user = useFragment(fragmentSpecUser, props.user);
  const todo = useFragment(fragmentSpecTodo, props.todo);

  console.log('renderer');

  const handleCompleteChange = (e: SyntheticEvent) => {
    const complete = e.currentTarget.checked;
    ChangeTodoStatusMutation.commit(environment, complete, todo, user);
  };

  const handleDestroyClick = () => removeTodo();
  const handleLabelDoubleClick = () => {
    if (!disabled) setIsEditing(true);
  };
  const handleTextInputCancel = () => setIsEditing(false);
github morrys / offline-examples / relay / nextjs / components / TodoList.tsx View on Github external
const TodoList = (props: Props) => {
  console.log("props", props);

  const environment = useRelayEnvironment();
  const user = useFragment(TodoList_user, props.user);
  const { todos, completedCount, totalCount, userId } = user;
  const handleMarkAllChange = (e: SyntheticEvent) => {
    const complete = e.currentTarget.checked;

    if (todos) {
      MarkAllTodosMutation.commit(environment, complete, todos, user);
    }
  };

  const nodes: ReadonlyArray =
    todos && todos.edges
      ? todos.edges
          .filter(Boolean)
          .map((edge: any) => edge.node)
          .filter(Boolean)
github relay-tools / relay-hooks / examples / relay-hook-example / nextjs-ssr / components / TodoApp.tsx View on Github external
const AppTodo = (props: Props) => {
  const environment = useRelayEnvironment();
  const [{user}, refetch] = useRefetch(fragmentSpec, props.query);

  if (!user) {
    return <div>;
  }

  const handleTextInputSave = (text: string) =&gt; {
    AddTodoMutation.commit(environment, text, user);
    return;
  };

  const hasTodos = user.totalCount &gt; 0;
  console.log('renderer');
  return (
    
      <header></header></div>
github morrys / react-relay-offline / src / hooks / useQueryOffline.ts View on Github external
const useQueryOffline = function(
  gqlQuery: GraphQLTaggedNode,
  variables: TOperationType["variables"],
  options: {
    fetchPolicy?: FetchPolicy;
    networkCacheConfig?: CacheConfig;
    ttl?: number;
  } = {}
): OfflineRenderProps {
  const environment = useRelayEnvironment();
  const ref = useRef&lt;{ rehydrated: boolean; error: Error; props: any }&gt;({
    rehydrated: environment.isRehydrated(),
    error: null,
    props: null
  });

  const [, forceUpdate] = useState(null);

  const { rehydrated } = ref.current;

  if (!rehydrated) {
    environment
      .hydrate()
      .then(() =&gt; {
        const current = {
          ...ref.current,