Use slug as id for articles

crosshare-org · May 29, 2024 · 45df7a6 · 45df7a6
1 parent ebc2d08
commit 45df7a6
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 50 deletions.
diff --git a/app/pages/articles/[slug]/edit.tsx b/app/pages/articles/[slug]/edit.tsx
@@ -1,7 +1,7 @@
-import { Timestamp, addDoc, query, updateDoc, where } from 'firebase/firestore';
+import { Timestamp, query, setDoc, updateDoc, where } from 'firebase/firestore';
 import * as t from 'io-ts';
 import Head from 'next/head';
-import NextJSRouter, { useRouter } from 'next/router';
+import { useRouter } from 'next/router';
 import { useRef } from 'react';
 import { useCollectionData } from 'react-firebase-hooks/firestore';
 import { requiresAdmin } from '../../../components/AuthHelpers.js';
@@ -12,12 +12,11 @@ import { useSnackbar } from '../../../components/Snackbar.js';
 import { DefaultTopBar } from '../../../components/TopBar.js';
 import { ArticleT, ArticleV } from '../../../lib/article.js';
 import {
-  getCollection,
   getDocRef,
   getValidatedCollection,
 } from '../../../lib/firebaseWrapper.js';
 import { markdownToHast } from '../../../lib/markdown/markdown.js';
-import { logAsyncErrors, slugify } from '../../../lib/utils.js';
+import { logAsyncErrors } from '../../../lib/utils.js';
 
 export default requiresAdmin(() => {
   const router = useRouter();
@@ -74,7 +73,7 @@ const ArticleLoader = ({ slug }: { slug: string }) => {
               c: 'article content',
               f: false,
             };
-            await addDoc(getCollection('a'), {
+            await setDoc(getDocRef('a', slug), {
               ...newArticle,
               ua: Timestamp.now(),
             }).then(() => {
@@ -108,23 +107,6 @@ const ArticleEditor = ({
           Note: changes may take up to an hour to appear on the site - we cache
           pages to keep Crosshare fast!
         </p>
-        <h3>Slug</h3>
-        <EditableText
-          title="Slug"
-          className="marginBottom1em"
-          text={article.s}
-          hast={markdownToHast({ text: article.s })}
-          maxLength={100}
-          handleSubmit={async (newSlug) => {
-            const slug = slugify(newSlug, 100, true);
-            await updateDoc(getDocRef('a', articleId), {
-              s: slug,
-              ua: Timestamp.now(),
-            }).then(async () => {
-              await NextJSRouter.push(`/articles/${slug}/edit`);
-            });
-          }}
-        />
         <h3>Title</h3>
         <EditableText
           title="Title"

diff --git a/app/pages/articles/index.tsx b/app/pages/articles/index.tsx
@@ -1,18 +1,11 @@
-import { Timestamp, addDoc } from 'firebase/firestore';
 import Head from 'next/head';
 import { useRef } from 'react';
 import { useCollectionData } from 'react-firebase-hooks/firestore';
 import { requiresAdmin } from '../../components/AuthHelpers.js';
-import { Button } from '../../components/Buttons.js';
 import { Link } from '../../components/Link.js';
-import { useSnackbar } from '../../components/Snackbar.js';
 import { DefaultTopBar } from '../../components/TopBar.js';
 import { ArticleT, ArticleV } from '../../lib/article.js';
-import {
-  getCollection,
-  getValidatedCollection,
-} from '../../lib/firebaseWrapper.js';
-import { logAsyncErrors } from '../../lib/utils.js';
+import { getValidatedCollection } from '../../lib/firebaseWrapper.js';
 
 const ArticleListItem = (props: ArticleT | null) => {
   if (!props) {
@@ -29,7 +22,6 @@ const ArticleListItem = (props: ArticleT | null) => {
 export default requiresAdmin(() => {
   const articleQuery = useRef(getValidatedCollection('a', ArticleV));
   const [articles] = useCollectionData(articleQuery.current);
-  const { showSnackbar } = useSnackbar();
 
   return (
     <>
@@ -39,24 +31,6 @@ export default requiresAdmin(() => {
       </Head>
       <DefaultTopBar />
       <div className="margin1em">
-        <Button
-          className="marginBottom2em"
-          text="New Article"
-          onClick={logAsyncErrors(async () => {
-            const newArticle: ArticleT = {
-              s: `new-article-${Math.round(Math.random() * 10000)}`,
-              t: 'New Article',
-              c: 'article content',
-              f: false,
-            };
-            await addDoc(getCollection('a'), {
-              ...newArticle,
-              ua: Timestamp.now(),
-            }).then(() => {
-              showSnackbar('Article created');
-            });
-          })}
-        />
         <h4>All Articles:</h4>
         <ul>{articles?.map(ArticleListItem)}</ul>
       </div>

diff --git a/app/scripts/generateWeeklyEmail.ts b/app/scripts/generateWeeklyEmail.ts
@@ -189,7 +189,8 @@ ${puzzles
   };
   return db
     .collection('a')
-    .add({
+    .doc(slug)
+    .set({
       ...article,
       ua: Timestamp.now(),
     })