docs(misc): adding nx live episode w Mike and some fixes (#27837)

<!-- Please make sure you have read the submission guidelines before
posting an PR -->
<!--
https://github.com/nrwl/nx/blob/master/CONTRIBUTING.md#-submitting-a-pr
-->

<!-- Please make sure that your commit message follows our format -->
<!-- Example: `fix(nx): must begin with lowercase` -->

<!-- If this is a particularly complex change or feature addition, you
can request a dedicated Nx release for this pull request branch. Mention
someone from the Nx team or the `@nrwl/nx-pipelines-reviewers` and they
will confirm if the PR warrants its own release for testing purposes,
and generate it for you if appropriate. -->

## Current Behavior
<!-- This is the behavior we have today -->

## Expected Behavior
<!-- This is the behavior we should expect with the changes in this PR
-->

## Related Issue(s)
<!-- Please link the issue being fixed so it gets closed when this is
merged. -->

Fixes #

docs/blog/2024-09-05-nx-live-introduction-to-nx.md

@@ -0,0 +1,10 @@
+---
+title: Introduction to Nx! | Nx Live
+slug: nx-live-intro-to-nx
+authors: ['Zack DeRose', 'Mike Hartington']
+tags: [livestream]
+cover_image: /blog/images/2024-09-05/thumbnail.png
+youtubeUrl: https://youtube.com/live/dgtZ6GHZ-tA
+---
+
+In this episode of Nx Live, Zack introduces new Nx team member Mike Hartington to the value of Nx. Together, Zack and Mike build out a full-stack application in their workspace - complete with linting, testing, and end-to-end tests using Nx's generators, and they look at the capabilities that Nx offers in terms of defining their workspace, and how Nx can leverage that information for task-running - especially in CI!

docs/blog/2024-09-06-personal-access-tokens.md → docs/blog/2024-09-10-personal-access-tokens.md

@@ -3,8 +3,9 @@ title: Better security with Personal Access Tokens
 slug: personal-access-tokens
 authors: ['Philip Fulcher']
 tags: [nx-cloud]
-cover_image: /blog/images/2024-09-06/personal-access-tokens-header.png
+cover_image: /blog/images/2024-09-10/personal-access-tokens-header.avif
 youtubeUrl: https://youtu.be/i51LPtagb2s
+published: false
 ---
 
 Today, Nx Cloud gets a huge upgrade to managing access to your cached artifacts
@@ -53,7 +54,7 @@ read from the cache, but limit read/write access to core contributors.
 
 ## Controlling default access
 
-![Personal access token settings in Nx Cloud workspace](/blog/images/2024-09-06/workspace-settings.avif)
+![Personal access token settings in Nx Cloud workspace](/blog/images/2024-09-10/workspace-settings.avif)
 
 By default, a workspace that opts in to personal access tokens will allow anonymous users (users without a personal
 access token defined) read-only access. This can be changed to disallow access to the cache for anonymous users

nx-dev/data-access-documents/src/lib/blog.api.ts

@@ -74,6 +74,7 @@ export class BlogApi {
         podcastIHeartUrl: frontmatter.podcastIHeartUrl,
         podcastAppleUrl: frontmatter.podcastAppleUrl,
         podcastAmazonUrl: frontmatter.podcastAmazonUrl,
+        published: frontmatter.published ?? true,
       };
       const isDevelopment = process.env.NODE_ENV === 'development';
       const shouldIncludePost = !frontmatter.draft || isDevelopment;

nx-dev/data-access-documents/src/lib/blog.model.ts

@@ -17,6 +17,7 @@ export type BlogPostDataEntry = {
   podcastAmazonUrl?: string;
   podcastAppleUrl?: string;
   podcastIHeartUrl?: string;
+  published?: boolean;
 };
 
 export type BlogAuthor = {

nx-dev/nx-dev/app/blog/page.tsx

@@ -26,7 +26,7 @@ export const metadata: Metadata = {
   },
 };
 async function getBlogs() {
-  return await blogApi.getBlogs();
+  return await blogApi.getBlogs((p) => !!p.published);
 }
 
 async function getBlogTags() {

nx-dev/ui-blog/src/lib/blog-container.tsx

@@ -78,8 +78,8 @@ export function sortFirstFivePosts(
   posts: BlogPostDataEntry[]
 ): BlogPostDataEntry[] {
   return posts
-    .slice(0, 5)
-    .sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime());
+    .sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime())
+    .slice(0, 5);
 }
 
 export function BlogContainer({ blogPosts, tags }: BlogContainerProps) {