feat(web): add Google Docs import UI page by devin-ai-integration[bot] · Pull Request #2961 · fastrepl/char

devin-ai-integration · 2026-01-10T08:28:59Z

Summary

Adds the admin UI for importing content from Google Docs. This is PR #8 in the stacked PR series for issue #2948 (new blog admin site).

The import page provides a two-step workflow:

Enter a published Google Docs URL with optional metadata (title, author, description, cover image, slug)
Review and edit the generated MDX content, then save to a selected content folder

Also enables the "Import from Google Docs" link on the admin dashboard (previously showed "Coming soon").

Updates since last revision

Added HTTP response status checks before parsing JSON responses. This ensures meaningful error messages are shown when the server returns non-2xx status codes (e.g., 500 errors, network failures) instead of cryptic JSON parsing errors.

Review & Testing Checklist for Human

Test the full import flow end-to-end - This UI depends on the backend endpoints from PR landing v0 #7. Verify: paste a published Google Doc URL → click Import → review MDX → select folder → save. The document must be published via File > Share > Publish to web in Google Docs.
Verify error handling - Test with invalid URLs, unpublished documents, and network failures to ensure errors display correctly
Check slug generation - The "Auto" button generates slugs from titles. Verify it handles special characters and edge cases properly
Verify folder selection matches backend - The hardcoded CONTENT_FOLDERS array must match the valid folders accepted by /api/admin/import/save

Recommended test plan:

Navigate to /admin/import while logged in as an admin
Create a test Google Doc and publish it to web
Paste the URL and fill in metadata fields
Click "Import Document" and verify MDX is generated
Edit the MDX if needed, select a folder, enter a slug
Click "Save to Repository" and verify the file is created on GitHub

Notes

This PR only adds the frontend UI. The backend API endpoints (/api/admin/import/google-docs and /api/admin/import/save) are in PR #7.

Link to Devin run: https://app.devin.ai/sessions/5c615647f58c421dabccc0cdd5b4270c
Requested by: @ComputelessComputer

- Remove Decap CMS files (config.yml, index.html, media-library.js, etc.) - Remove netlify-identity-redirect.js and its reference in __root.tsx - Move mdx-format-core.js to scripts/ folder (still used by format-mdx.js) - Add admin authentication with email whitelist - Add admin layout route with auth guard - Add admin dashboard and media library placeholder pages - Update handbook documentation to reflect new admin system Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

The _admin prefix creates a pathless layout route which conflicts with _view's index.tsx since both resolve to '/'. Renaming to 'admin' creates routes at /admin/* which don't conflict. Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

- Add github-media.ts with utilities for listing, uploading, deleting, moving files and creating folders via GitHub API - Add /api/admin/media/list endpoint for listing media files - Add /api/admin/media/upload endpoint for uploading files - Add /api/admin/media/delete endpoint for batch deleting files - Add /api/admin/media/move endpoint for moving/renaming files - Add /api/admin/media/create-folder endpoint for creating folders - All endpoints protected with admin authentication check Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

- Add responsive file grid with folder and image thumbnails - Add drag-and-drop file upload functionality - Add breadcrumb navigation for folder hierarchy - Add file selection with batch delete support - Add create folder functionality - Add copy-to-clipboard for file paths - Show file sizes and loading states Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

- Add select all / deselect all functionality - Add batch download for selected files - Add batch move with folder picker dialog - Add selection toolbar with count display - Improve selection UI with cancel button Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

- Add right-click context menu for files and folders - Add individual item actions: download, copy path, copy as PNG - Add rename functionality with modal dialog - Add move functionality from context menu - Add delete functionality from context menu - Context menu auto-closes on click outside Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

… library - Add collapsible left sidebar with search input - Add file type filter (All, Images, Videos, Documents) - Add folder tree navigation with expandable nodes - Add clear filters button when filters are active - Filter items by search query and file type - Show helpful message when no files match filters - Sidebar toggle button in header Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

- Add /api/admin/import/google-docs endpoint to parse published Google Docs - Convert Google Docs HTML to Markdown format - Generate MDX with proper frontmatter (title, author, date, etc.) - Add /api/admin/import/save endpoint to save MDX files to content folder - Support multiple content folders (articles, changelog, docs, etc.) - Admin authentication required for all endpoints Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

- Add /admin/import page with import form - Support URL input, title, author, description, cover image, slug - Preview and edit generated MDX before saving - Select destination folder (articles, changelog, docs, etc.) - Auto-generate slug from title - Enable import link on admin dashboard Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

- Change from createAPIFileRoute to createFileRoute with server.handlers - Use fetchAdminUser instead of isAdmin for auth check - Fix indentation to match existing API route patterns Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

devin-ai-integration · 2026-01-10T08:29:02Z

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

Address comments on this PR that start with 'DevinAI' or '@devin'.
Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

Disable automatic comment and CI monitoring

apps/web/src/routes/admin/import/index.tsx

Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

…handler Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

Co-authored-by: graphite-app[bot] <96075541+graphite-app[bot]@users.noreply.github.com>

…revocation Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

…032944-media-context-menu

…096-media-sidebar-search

…33298-google-docs-import

…442-google-docs-import-ui

Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

devin-ai-integration bot and others added 10 commits January 10, 2026 07:40

devin-ai-integration bot assigned ComputelessComputer Jan 10, 2026

devin-ai-integration bot requested a review from ComputelessComputer January 10, 2026 08:29

graphite-app bot reviewed Jan 10, 2026

View reviewed changes

apps/web/src/routes/admin/import/index.tsx Show resolved Hide resolved

apps/web/src/routes/admin/import/index.tsx Show resolved Hide resolved

devin-ai-integration bot and others added 3 commits January 10, 2026 08:43

fix(web): add HTTP response status check before parsing JSON

996c450

Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

fix(web): improve file existence check to handle non-404 errors

414a27e

Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

fix(web): add response status check before creating blob in download …

d00043f

…handler Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

This was referenced Jan 10, 2026

feat(web): add content management UI for browsing MDX files #2964

Merged

docs(web): add README for admin interface #2965

Merged

ComputelessComputer and others added 11 commits January 12, 2026 00:49

Update apps/web/src/routes/admin/media/index.tsx

296fcc1

Co-authored-by: graphite-app[bot] <96075541+graphite-app[bot]@users.noreply.github.com>

Update apps/web/src/routes/admin/media/index.tsx

efeef81

Co-authored-by: graphite-app[bot] <96075541+graphite-app[bot]@users.noreply.github.com>

Merge branch 'main' into devin/1768032794-media-selection-batch

725a74b

feat(routes): add admin media API routes to routeTree

9e5bcca

fix(web): improve batch download to continue on errors and delay URL …

dfbbadc

…revocation Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

Merge branch 'devin/1768032794-media-selection-batch' into devin/1768…

58c9ff3

…032944-media-context-menu

Merge branch 'devin/1768032944-media-context-menu' into devin/1768033…

580fe5e

…096-media-sidebar-search

Merge branch 'devin/1768033096-media-sidebar-search' into devin/17680…

1980413

…33298-google-docs-import

Merge branch 'devin/1768033298-google-docs-import' into devin/1768033…

6fd3192

…442-google-docs-import-ui

merge: resolve conflicts with main in media/index.tsx

9348186

Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

merge: resolve conflicts with main in media/index.tsx

195fa0b

Co-Authored-By: john@hyprnote.com <john@hyprnote.com>

Base automatically changed from devin/1768033298-google-docs-import to main January 11, 2026 16:45

ComputelessComputer merged commit 7cf0770 into main Jan 11, 2026
6 of 7 checks passed

ComputelessComputer deleted the devin/1768033442-google-docs-import-ui branch January 11, 2026 16:46

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(web): add Google Docs import UI page#2961

feat(web): add Google Docs import UI page#2961
ComputelessComputer merged 24 commits intomainfrom
devin/1768033442-google-docs-import-ui

devin-ai-integration bot commented Jan 10, 2026 •

edited

Loading

Uh oh!

devin-ai-integration bot commented Jan 10, 2026

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Comments

Conversation

devin-ai-integration bot commented Jan 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Updates since last revision

Review & Testing Checklist for Human

Notes

Uh oh!

devin-ai-integration bot commented Jan 10, 2026

🤖 Devin AI Engineer

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Comments

devin-ai-integration bot commented Jan 10, 2026 •

edited

Loading