Getting Documents

Single Document

query singleDocument($id: String!) {
  document(documentId: $id) {
    id
    description
    labels
    # ...
  }
}

// variables
{
  "id": "..."
}

Document List

the base query looks like this:

query documentsList($after: String, $folderId: String) {
  documents(first: 25, after: $after, filter: { folderId: $folderId }) {
    pageInfo {
      hasNextPage
      endCursor
    }
    edges {
      cursor
      node {
        id
        description
        labels
        # ...
      }
    }
  }
}

// variables
{
  "after": "...", // optional
  "folderId": "..." // optional
}

Both folderId and after are optional. To paginate, check hasNextPage; if true, pass endCursor as after to fetch the next page.

Omitting folderId is equivalent to the "All Memos" view in the web app and returns all documents you have access to. Passing a folderId returns only documents directly in that folder.

info

More Filter Options can be seen at: DocumentFilterInput

Example from within a React App

warning

this is not a fully functional example, but an oversimplified version of what we actually are doing in our app. So it should give you a fairly good hint on how it should work from a conceptual level.

/*
  Note the SingleDocumentFragment. its a GraphQL Fragment.
  Useful when always using the same fields on a specific type.
*/
const DOCUMENTS = gql`
  ${SingleDocumentFragment}
  query DocumentList(
    $folderId: String
    $after: String
    $first: Int!
    $sortOrderBy: DocumentSortAfter!
    $sortDirection: SortDirection!
  ) {
    documents(
      filter: { folderId: $folderId }
      first: $first
      after: $after
      sortDirection: $sortDirection
      sortAfter: $sortOrderBy
    ) {
      pageInfo {
        endCursor
        hasNextPage
      }
      edges {
        cursor
        node {
          id
          ...SingleDocumentFragment
        }
      }
    }
  }
`;

const DocumentsList = ({ folderId }) => {
  const { data, fetchMore, loading } = useQuery(FOLDERS, {
    fetchPolicy: "cache-and-network",
    variables: {
      first: 25,
      folderId,
      sortDirection: "DESC",
      sortOrderBy: "UPLOADED_AT",
    },
  });

  const onLoadMoreContent = React.useCallback(async () => {
    if (
      loading ||
      !data?.documents?.pageInfo?.endCursor ||
      !data?.documents?.pageInfo?.hasNextPage ||
      !fetchMore
    ) {
      return;
    }
    await fetchMore({
      variables: {
        after: data.documents.pageInfo.endCursor,
        first: 25,
      },
    });
  }, [loading, fetchMore, data]);
  return (
    <Container>
      <VirturalList
        documents={data?.documents}
        onLoadMoreContent={onLoadMoreContent}
      />
    </Container>
  );
};