This Site

This site is made using Docusaurus.

Interesting stuff

useCSV hook

The list of solutions at LeetCode solutions are fetched from a web publised google sheet.

import { useEffect, useState } from "react";
import Papa from "papaparse";

const useCSV = (url) => {
    const [fields, setFields] = useState([]);
    const [rows, setRows] = useState([]);
    const [loader, setLoader] = useState(true);

    useEffect(() => {
        let ignore = false;
        const fetchData = async () => {
            const res = await new Promise((resolve, reject) => {
                Papa.parse(url, {
                    download: true,
                    header: true,
                    complete: (res) => {
                        resolve(res);
                    },
                    error: (error) => {
                        reject(error);
                    },
                });
            });
            if (!ignore) {
                setFields(res.meta.fields);
                setRows(res.data);
                setLoader(false);
            }
        };
        fetchData();
        return () => {
            ignore = true;
        };
    }, []);

    return [fields, rows, loader];
};

export default useCSV;

Locally stored solutions

The LeetCode solutions are stored in the local storage for better UX.

import useSolutions from "./useSolutions";

const useStoredSolutions = (url) => {
    const [solutions, loader] = useSolutions(url);

    if (typeof window !== "undefined") {
        if (!loader) {
            localStorage.setItem(url, JSON.stringify(solutions));
        }
        const storedSolutions = JSON.parse(localStorage.getItem(url));
        if (!storedSolutions) {
            return [solutions, loader];
        }
        return [storedSolutions, false];
    }
    return [solutions, loader];
};

export default useStoredSolutions;

Client side search

The local search at LeetCode solutions uses Fuse.js to index and search solutions on the client side.