Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/shadownrx/windows/llms.txt

Use this file to discover all available pages before exploring further.

useFileSystem provides access to the Virtual File System (VFS) context — an in-memory file system that supports full CRUD operations without ever touching the user’s real disk. Because NEX OS runs entirely in the browser, all files and folders exist only in React state, giving your applications a safe, sandboxed environment to create, read, update, and delete content just as they would on a real operating system.

Import

import { useFileSystem } from '../context/FileSystemContext';

VirtualFile Interface

Every file in the VFS is represented as a VirtualFile object.
interface VirtualFile {
  id: string;
  name: string;
  location: string;
  extension: string;
  content: string;
  createdAt: Date;
}
id
string
Auto-generated unique identifier returned by createFile. Use this to reference the file in updateFileContent calls.
name
string
The file’s display name, without the extension.
location
string
The virtual directory path where the file lives, e.g. '/Users/Default/Documents'.
extension
string
The file extension without a leading dot, e.g. 'txt', 'js', 'nex'.
content
string
The raw text content of the file. Binary files are represented as base64-encoded strings.
createdAt
Date
Timestamp set when the file was created via createFile.

Properties

files
VirtualFile[]
The complete flat list of all virtual files currently in the VFS. Filter by location to display directory-scoped listings, or search by extension to find files of a specific type.

Methods

createFile

Creates a new VirtualFile in the specified directory and returns the auto-generated id of the newly created file.
location
string
required
The virtual directory path where the file should be created, e.g. '/Users/Default/Documents'.
name
string
required
Display name for the new file, without the extension.
ext
string
required
File extension without a leading dot, e.g. 'txt' or 'md'.
Returns: string — the id of the newly created file.

updateFileContent

Replaces the content field of an existing file with new text.
id
string
required
The unique identifier of the file to update. Obtain this from createFile or from files.find(...).
content
string
required
The new content string to write into the file. Overwrites any previous value.

Updates the active currentPath in the File Explorer, causing it to render the contents of the target directory.
path
string
required
The virtual path to navigate to, e.g. '/Users/Default/Pictures'.

openFile

Opens a VirtualFile in the appropriate system application. The VFS inspects the file’s extension to determine which app to launch via the WindowManager.
file
VirtualFile
required
The file object to open. Pass a reference from the files array directly.

createFolder

Creates a new virtual directory inside the current path.
name
string
required
Display name of the new folder.

deleteFile

Removes a file or folder from the VFS by its path.
path
string
required
The full virtual path of the file or folder to delete, e.g. '/Users/Default/Documents/notes.txt'.
Deleting a folder is recursive — all files and subfolders inside it are permanently removed from the VFS. There is no recycle bin recovery at the context level; implement your own undo logic before calling this if you need it.

getFileContent

Reads and returns the content of a file at the given path without opening it in a window.
path
string
required
Full virtual path of the file to read.
Returns: string | Buffer — the file’s raw content, or a Buffer for binary files.

Usage Example

The following example shows how Notepad uses useFileSystem to load an existing file’s content and autosave changes on blur.
import { useFileSystem } from '../../context/FileSystemContext';

export const Notepad = ({ fileId }: { fileId?: string }) => {
  const { files, updateFileContent } = useFileSystem();
  const file = files.find(f => f.id === fileId);

  const handleSave = (text: string) => {
    if (fileId) updateFileContent(fileId, text);
  };

  return (
    <textarea
      defaultValue={file?.content}
      onBlur={e => handleSave(e.target.value)}
    />
  );
};

Virtual Directory Tree

The VFS is pre-seeded with a familiar directory structure on startup:
/
├── Users/
│   └── Default/
│       ├── Documents/
│       ├── Downloads/
│       └── Pictures/
├── Program Files/
└── Windows/
The VFS is entirely sandboxed in browser memory — there is no access to the user’s real filesystem. This is a deliberate security boundary enforced by the browser. All file data is lost on a hard page refresh unless you build persistence on top of localStorage or IndexedDB.
When building an app that creates files programmatically, store the id returned by createFile in your component’s state. This is the most reliable way to reference the file later for updates — path-based lookups can break if a file is moved.

Build docs developers (and LLMs) love