r3dm1ke

import {useQuery} from "@apollo/react-hooks";
import React from 'react';
import {Typography, makeStyles, CircularProgress} from "@material-ui/core";
import {useDebounce} from "use-debounce";
import {SEARCH_FOR_REPOS} from "./queries";

const useStyles = makeStyles({
  note: {
    marginTop: '1rem',
    textAlign: 'center',

r3dm1ke

import React, {useState} from 'react';
import { ApolloProvider } from '@apollo/react-hooks';
import client from './client';
import {Typography, Container, makeStyles} from "@material-ui/core";
import RepositoryList from "./RepositoryList";
import SearchBar from "./SearchBar";

const useStyles = makeStyles({
  title: {
    marginTop: '1rem',

r3dm1ke

import React from 'react';
import { ApolloProvider } from '@apollo/react-hooks';
import client from './client';
import {Typography, Container, makeStyles} from "@material-ui/core";
import RepositoryList from "./RepositoryList";
import SearchBar from "./SearchBar";

const useStyles = makeStyles({
  title: {
    marginTop: '1rem',

r3dm1ke

import ApolloClient from 'apollo-boost';

const client = new ApolloClient({
  uri: 'https://api.github.com/graphql',
  headers: {
    Authorization: `bearer ${process.env.REACT_APP_GITHUB_KEY}`
  }
});

export default client;

r3dm1ke

import React from 'react';
import {Typography, Container, makeStyles} from "@material-ui/core";
import RepositoryList from "./RepositoryList";
import SearchBar from "./SearchBar";

const useStyles = makeStyles({
  title: {
    marginTop: '1rem',
    marginBottom: '1rem',
    textAlign: 'center'

r3dm1ke

import React from 'react';
import {Typography, makeStyles} from "@material-ui/core";

const useStyles = makeStyles({
  noRepoNote: {
    marginTop: '1rem',
    textAlign: 'center',
  }
});

r3dm1ke

import React from 'react';
import {TextField, InputAdornment, makeStyles} from "@material-ui/core";
import SearchIcon from '@material-ui/icons/Search';

const useStyles = makeStyles({
  input: {
    width: '100%'
  }
});

r3dm1ke

{
  "data": {
    "search": {
      "repositoryCount": 1205189,
      "edges": [
        {
          "node": {
            "name": "react",
            "owner": {
              "login": "facebook"

r3dm1ke

import gql from 'graphql-tag';

export const SEARCH_FOR_REPOS = gql`
    query($search_term: String!) {
        search(query: $search_term, type: REPOSITORY, first: 20) {
            repositoryCount,
            edges {
                node {
                    ... on Repository {
                        name,

r3dm1ke

{
  "name": "Github Schema",
  "schemaPath": "./schema.graphql",
  "extensions": {
    "endpoints": {
      "Github GraphQL Endpoint": {
        "url": "https://api.github.com/graphql",
        "headers": {
          "Authorization": "bearer YOUR TOKEN HERE"
        },