Skip to content

yashsehgal/stack-ai-file-system-assignment

Repository files navigation

Knowledge base setup via Google Drive

Quick actions

This project contains code for my Stack AI Frontend Engineer Assignment. The task was to create a live-synced knowledge base system with Stack AI using Google Drive for file and document uploads.

The project user experience and flow can be tested by the following steps:

  • Click on upload > A google drive file system will open
  • Select files that you want to upload and click on upload. You can also deselect files.
  • Once the upload is done, the knowledge base which is sycned with Stack AI workflow builder will get rendered in the same format, the Google Drive files are uploaded.
  • You can explore and test the following features then:
    • Filter folders and files using the search input in the header section.
    • Toggle to List and Grid view for better experience.

Technologies and coding concepts used

  • NextJS
  • TailwindCSS
  • Typescript
  • Vercel for deployment
  • TanStack React Query for data fetching methods
  • Axios for writing APIs
  • Context API to store the complete applications context as a single source of truth.

How to setup the project locally

To setup this project, follow the mentioned steps:

  • Clone the repository in your local machine.
  • Run the command mentioned below to install all the dependencies and run the project.
    yarn && yarn dev
    
  • Contact for .env keys for running Google Drive and Knowledge base modules.

Coding pattern

  • app - All the routed pages are present inside.
  • modules - All the modules such as Google Drive and Knowledge Base are present as modules.
  • components - Storing all the shared components and shadcn components.
  • constants - Shared constants across the project.
  • services - All the services related to available modules i.e. Google Drive Setup and Knowledge Base Management
  • providers - All the shared providers are available. This folder convention is also available for ApplicationContext inside nested folders.
  • interfaces - All the nested folders have their own interfaces, types and enums present relatively inside modules and other components.
  • contexts - For storing the contexts related to application.

About

Code for the File System Assignment for Frontend Engineer Role at Stack AI

Resources

Stars

Watchers

Forks