Dashboard

Introduction

The Dashboard is a file system GUI for organizing uploaded files in Neon.

It can be broken down into the

• model (src/Dashboard/FileSystem)
• view (All the HTML elements)
• controller (event listeners and logic in src/Dashboard/Dashboard.ts and referenced)

Naming schema

View

A Tile refers to the HTMLDivElement in the view that corresponds to an entry that the user can interact with (via opening, drag and dropping into a folder, right click, etc).

Model

An Entry is referring to a file or folder in model.

A File is an uploaded resource meant to be opened in the Neon Editor.

A Folder is a folder in the dashboard file system that can contain other entries.

A Folio is a file that contains single page folio.

A Manuscript is a file that contains a multi-page manuscript.

Reference

FileSystem (model)

export interface IEntry {
  name: string;
  type: EntryType;
  id: string;
  children: IEntry[];
  metadata: { [key: string]: unknown };
}

export interface IFolder extends IEntry {
  type: EntryType.Folder;
  id: string;
  children: IEntry[];
}

export interface IFile extends IEntry {
  type: EntryType.File
  id: string;
}

Notes:

• The unique identifier for an entry is a generated uuid.
• The metadata field contains any number of key-value pairs. A few of the current reserved keys are:
• "type": "folio" or "manuscript"
• "document": "sample". if present, indicates that the file is a non-user uploaded resource and how to open it in openFile() and openEditorTab()
• "immutable": true. if present, indicated that the file is not to be deleted or moved depending on context.