Introduce blog admin UI to easily manage all blog posts and access additional settings

[ori-near]

Problem

The current blog "admin" experience is sadly terrible and counter intuitive. This is what an admin sees:

The left sidebar greets them with a cryptic ID number on the sidebar with no clear association to blog posts. A user might wonder how we came up with these IDs (e.g. we're starting with 2028, 2029, 2030, but then we have 2015 ... 3251). (Note the author of this ticket understands why but is writing this from the perspective of the user who doesn't have the context). Also the user is forced into creating new blog post mode. But maybe that's not what they have in mind. Maybe they just want to see their list of blogs. Long story short – the admin needs simplicity, organization, context. So that they can easily manage their blog.

User Story

As a blog admin, I want the first admin/dashboard that I see to provide a clear and immediate understanding of all available blog posts so that I can successfully manage my blog and create effective content for developers.

Acceptance Criteria

• [x] Maintain the two-panel layout approach with a clickable left sidebar and right content edit area when the admin is actually clicking or creating new posts.
• [x] Upon initial view though, the admin should see a table view that displays all the blog posts in a human friendly format (see Admin Dashboard example below). Columns should include blog post title, status (draft, published), created timestamp, modified timestamp, and published timestamp.
• [x] Add 3 buttons at the top right corner: "Analytics", "Settings", and "+New Blog Post"
  • [ ] Analytics will launch the analytics experience described in https://github.com/NEAR-DevHub/neardevhub-bos/issues/731
  • [ ] Settings will launch the experience described in https://github.com/NEAR-DevHub/neardevhub-bos/issues/562, which would provide additional configurations (e.g. title, enable/disable search, etc).
  • [x] New Blog Post should initiate the new post creation experience in the two-panel layout (see below)
• [x] Clicking on an existing blog post within the table should launch into the two-panel layout.
  • [x] The left sidebar should only display the title, not ID numbers. And highlight the selected blog post.
  • [x] The right content area will show the existing edit/preview functionality and content of the selected posts
• [x] Clicking on New Blog Post should:
  • [x] The left sidebar should add an entry to the top with an initial title (e.g. "New Blog Post")
  • [x] The right content area will show the existing edit/preview functionality with empty fields
  • [x] Admin can click:
    • [x] Save Draft, which would return them to the table view with the status for the blog reflected as draft OR
    • [x] Cancel, which would return them to the table view with no post created
    • [x] Publish, which would return them to the table view with the status for the blog reflected as published

Examples

Admin Dashboard

New Blog Post

Viewing/Editing Existing Post