FileGrid

The FileGrid component is a specialised grid for managing Dataverse records whose main content is a single file column. It wraps MainGrid and layers on drag-and-drop upload, per-row preview and download icons, and a bulk zip-download of every loaded file. The grid also honours Dataverse's environment-wide blocked-extensions list and per-column size limits, and participates in MainContext / RecordContext save pipelines when one is in scope.

Basic Usage

Specify the table and the logical name of the file column that the grid should manage. Upload, Replace File, Download All, and Delete buttons appear automatically; files can also be dropped onto the grid. Pass a <Buttons> render fragment to add your own toolbar buttons alongside the built-ins — the same pattern MainGrid and SubGrid support.

<FileGrid TableName="ppp_file"
          FileColumn="ppp_data" />

Automatic File-Column Injection

If the active view's FetchXML and column list don't already include the FileColumn, the grid grafts it onto a cloned copy so the filename, type icon, and per-row preview/download icons always render — regardless of which view the user picks. The cache-shared view instance is left untouched, so other grids aren't affected.

<!-- Even if the saved view doesn't include ppp_data in its column list, the
     FileGrid adds it automatically so the filename and action icons are always visible. -->
<FileGrid TableName="ppp_file"
          FileColumn="ppp_data"
          DefaultViewId="@(new Guid("..."))"
          ViewIds="_viewIds" />

Maximum File Size

Use MaxFileSizeBytes to cap the size of uploaded files. The grid clamps your value down to the smaller of the column's MaxSizeInKB metadata and the environment's maxuploadfilesize setting, so a file rejected server-side can't get queued in the first place. Files over the effective cap produce a dialog before they're sent to Dataverse.

<FileGrid TableName="ppp_file"
          FileColumn="ppp_data"
          MaxFileSizeBytes="10485760" />

Allowed Extensions

Pass AllowedExtensions to restrict uploads to a whitelist of extensions. Rejected files produce a dialog explaining which extensions are accepted. When left unset, any extension is allowed (subject to the environment's blocklist below).

<FileGrid TableName="ppp_file"
          FileColumn="ppp_data"
          AllowedExtensions="@(new[] { ".pdf", ".docx", ".txt" })" />

Environment Blocklist

Dataverse environments maintain a blockedattachments list that rejects certain extensions (SVG, EXE, BAT, JS, etc.) regardless of caller. The FileGrid reads this list at init via the IPowerPortalsProService.GetEnvironmentFileSettingsAsync() call, caches it for an hour, and rejects matching files client-side with a friendly message instead of a server-side fault. The environment blocklist always wins over AllowedExtensions — a column's allow-list can't override an environment-level block.

Can't upload SVGs?

Dataverse environments block svg by default because SVGs can carry embedded scripts. If you need SVG uploads, remove it from the environment's Set blocked file extensions for attachments setting in the Power Platform admin center — this grid will pick the change up within an hour.

Permission Gating

The Upload button and the drop-zone activation both honour whether the current portal user has Create permission on the target table. When the user lacks create, the Upload button is hidden and dragging files over the grid is a no-op — server-side enforcement still runs as a backstop. Permission is resolved via ITablePermissionCache so custom ITableRecordPermissionHandler implementations feed into the same gating logic. The Upload button also auto-hides whenever one or more rows are selected, to keep the toolbar tidy.

Per-Row Preview & Download

The file column renders as [type-icon] filename [eye] [download]. The Preview icon opens the FilePreviewDialog — see Preview Rendering below for what each file type looks like. The Download icon streams the file through the FileDownload JSInterop component. Either icon can be toggled off per-grid via AllowPreviewForFileColumns / AllowDownloadForFileColumns.

<!-- Both icons default to true. Turn either off per-grid. -->
<FileGrid TableName="ppp_file"
          FileColumn="ppp_data"
          AllowPreviewForFileColumns="true"
          AllowDownloadForFileColumns="true" />

The Preview icon only appears for file types the dialog can render — unsupported extensions skip the icon rather than surface a broken affordance. Both action icons are hidden on pending-create rows (records that haven't been saved to Dataverse yet).

Preview Rendering

The FilePreviewDialog picks a renderer based on the file's extension:

• Images (png, jpg, jpeg, gif, bmp, webp, svg) — inline <img> with a base64 data URL. Constrained to 70 vh so very tall images stay scrollable within the dialog.
• PDFs — loaded as a blob URL into an <iframe> so the browser's built-in viewer handles multi-page scrolling, zoom, search, and text selection. The blob URL is revoked on dialog close.
• Markdown (md, markdown) — converted to HTML server-side via Markdig with its advanced extensions (tables, task lists, fenced code, autolinks, footnotes) and shown in a Preview tab. A second Text tab shows the raw source with syntax highlighting. Raw HTML passthrough in the source is stripped before rendering, so a .md can't smuggle in <script> or an <iframe>.
• Source & structured text (json, xml, yaml, yml, html, htm, js, ts, cs, css) — rendered in a <pre> with highlight.js colorization. The language is chosen from the extension via FileTypeIcons.GetSyntaxLanguage; only the advertised languages are bundled to keep the asset size small. Highlighting runs through a colocated FilePreviewDialog.razor.ts module over JS interop — if the interop call fails the dialog silently falls back to uncolored text.
• Plain text (txt, log, csv) — rendered in a <pre> with no highlighting. highlightAuto is intentionally not used because its guesses on short snippets (a tiny log or a single CSV row) produce more confusing color than no color at all.
• Zip archives (zip) — parsed in-memory via System.IO.Compression.ZipArchive and rendered as a split pane: a collapsible tree on the left (folders first, alphabetical, with per-entry size and last-modified surfaced on hover), and the selected entry's preview on the right. The right pane is a nested FilePreviewContent, so inner files route through the same renderer lookup — images, PDFs, highlighted source, markdown, and even zip-within-zip all preview the same way they would standalone. The archive is never extracted to disk.

Download All (Zip)

The toolbar's Download All button streams every file currently rendered in the grid as a single zip, built in-memory server-side via ZipArchive and piped through the Blazor circuit — no extra HTTP endpoint required. Duplicate filenames get a (2), (3) suffix. Set AllowDownloadAll="false" to hide the button without disabling the per-row download icons.

<FileGrid TableName="ppp_file"
          FileColumn="ppp_data"
          AllowDownloadAll="false" />

Customising the Created Record

By default each uploaded file creates a minimal record with only the file column populated. For tables with additional required columns — or to seed other data — pass OnUploadRecordAsync and return a fully-populated TableRecord. The delegate is async so you can consult services, resolve lookups, or generate names before returning.

<FileGrid TableName="ppp_file"
          FileColumn="ppp_data"
          OnUploadRecordAsync="BuildFileRecord" />

@code {
    private async Task<TableRecord> BuildFileRecord(string fileName, byte[] data)
    {
        var record = new TableRecord { TableName = "ppp_file" };
        record["ppp_filename"] = new StringValue { Value = fileName };
        record["ppp_data"] = new FileValue
        {
            FileName = fileName,
            Id = Guid.Empty,
            Value = data,
        };
        return record;
    }
}

MainContext / RecordContext Integration

When the grid is nested inside a MainContext or RecordContext, uploads are staged into the grid's pending-create list instead of being created immediately. The parent context's IsDirty flips to true, and on SaveAsync the staged records (with their FileValue bytes) are batched through ExecuteMultipleAsync — which handles the post-create chunked file upload for each record. This keeps the file uploads transactional with the rest of the form.

<MainContext>
    <MenuBar>
        <SaveContextButton />
        <RefreshContextButton />
    </MenuBar>

    <FileGrid TableName="ppp_file"
              FileColumn="ppp_data" />
</MainContext>

Pending-create rows appear in the grid immediately with the file type icon and filename, but without the Preview or Download icons (there's no server file yet). They're removed from the pending list when the context saves, or reset via RefreshContextButton / MainContext.ResetState().