# Upload Store (https://s3.dimah.dev/docs/react/upload-store)



An `UploadStore` persists `uploadId` and part state so in-flight multipart uploads can resume after a browser reload.

```ts title="lib/upload-store.ts"
import { createLocalStorageStore } from "@dimah-s3/react";

export const localStorageStore = createLocalStorageStore();
```

```tsx title="app/video-uploader.tsx"
"use client";

import { useUpload } from "@dimah-s3/react";
import { localStorageStore } from "@/lib/upload-store";

export function VideoUploader() {
  const upload = useUpload({
    route: "video",
    multipart: true,
    uploadStore: localStorageStore,
  });

  return (
    <div
      {...upload.getRootProps()}
      className="border p-4 rounded text-center cursor-pointer"
    >
      <input {...upload.getInputProps()} />
      {upload.isUploading
        ? `Uploading: ${upload.progress.percent}%`
        : "Upload large video"}
    </div>
  );
}
```

Resume keys are uniquely hashed by `${route}:${file.name}:${file.size}:${file.lastModified}`.

***

## Built-in stores [#built-in-stores]

* `createLocalStorageStore()` — persists in browser `localStorage` across page reloads.
* `createMemoryStore()` — in-memory store for unit tests or SSR.

```ts
import { createLocalStorageStore, createMemoryStore } from "@dimah-s3/react";

const memoryStore = createMemoryStore();
const localStore = createLocalStorageStore();
```

***

## Custom upload store interface [#custom-upload-store-interface]

```ts
import type { UploadStore, StoredUpload } from "@dimah-s3/react";
```

<AutoTypeTable path="packages/react/src/types/upload-store.ts" name="UploadStore" />

## Frequently asked questions [#frequently-asked-questions]

<Accordions>
  <Accordion title="Does the upload store work with the @dimah-s3/db plugin?">
    Yes. When using `@dimah-s3/db`, the server tracks pending multipart uploads in your database. You can implement a store `get` method to fetch active multipart upload IDs across devices.
  </Accordion>

  <Accordion title="When should I enable uploadStore?">
    Use `uploadStore` for routes with large files (videos, archives, large datasets) where users may refresh or lose connection mid-upload. Small single-part uploads do not need a store.
  </Accordion>
</Accordions>
