diff --git a/src/components/Datetime.tsx b/src/components/Datetime.tsx
index 372b3ed79..aedcdb1fc 100644
--- a/src/components/Datetime.tsx
+++ b/src/components/Datetime.tsx
@@ -1,11 +1,17 @@
-import { LOCALE } from "@config";
+import { LOCALE, SITE } from "@config";
+import type { CollectionEntry } from "astro:content";
interface DatetimesProps {
pubDatetime: string | Date;
modDatetime: string | Date | undefined | null;
}
-interface Props extends DatetimesProps {
+interface EditPostProps {
+ editPost?: CollectionEntry<"blog">["data"]["editPost"];
+ postId?: CollectionEntry<"blog">["id"];
+}
+
+interface Props extends DatetimesProps, EditPostProps {
size?: "sm" | "lg";
className?: string;
}
@@ -15,6 +21,8 @@ export default function Datetime({
modDatetime,
size = "sm",
className = "",
+ editPost,
+ postId,
}: Props) {
return (
+ {size === "lg" && }
);
@@ -72,3 +81,30 @@ const FormattedDatetime = ({ pubDatetime, modDatetime }: DatetimesProps) => {
);
};
+
+const EditPost = ({ editPost, postId }: EditPostProps) => {
+ let editPostUrl = editPost?.url ?? SITE?.editPost?.url ?? "";
+ const showEditPost = !editPost?.disabled && editPostUrl.length > 0;
+ const appendFilePath =
+ editPost?.appendFilePath ?? SITE?.editPost?.appendFilePath ?? false;
+ if (appendFilePath && postId) {
+ editPostUrl += `/${postId}`;
+ }
+ const editPostText = editPost?.text ?? SITE?.editPost?.text ?? "Edit";
+
+ return (
+ showEditPost && (
+ <>
+ |
+
+ {editPostText}
+
+
+ )
+ );
+};
diff --git a/src/config.ts b/src/config.ts
index a0341b732..b4e327863 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -11,6 +11,11 @@ export const SITE: Site = {
postPerIndex: 4,
postPerPage: 3,
scheduledPostMargin: 15 * 60 * 1000, // 15 minutes
+ editPost: {
+ url: "https://github.com/satnaing/astro-paper/edit/main/src/content/blog",
+ text: "Suggest Changes",
+ appendFilePath: true,
+ },
};
export const LOCALE = {
diff --git a/src/content/blog/how-to-configure-astropaper-theme.md b/src/content/blog/how-to-configure-astropaper-theme.md
index 95ea128cd..ced018683 100644
--- a/src/content/blog/how-to-configure-astropaper-theme.md
+++ b/src/content/blog/how-to-configure-astropaper-theme.md
@@ -33,22 +33,28 @@ export const SITE = {
lightAndDarkMode: true,
postPerPage: 3,
scheduledPostMargin: 15 * 60 * 1000, // 15 minutes
+ editPost: {
+ url: "https://github.com/satnaing/astro-paper/edit/main/src/content/blog",
+ text: "Suggest Changes",
+ appendFilePath: true,
+ },
};
```
Here are SITE configuration options
-| Options | Description |
-| --------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `website` | Your deployed website url |
-| `author` | Your name |
-| `desc` | Your site description. Useful for SEO and social media sharing. |
-| `title` | Your site name |
-| `ogImage` | Your default OG image for the site. Useful for social media sharing. OG images can be an external image url or they can be placed under `/public` directory. |
-| `lightAndDarkMode` | Enable or disable `light & dark mode` for the website. If disabled, primary color scheme will be used. This option is enabled by default. |
-| `postPerIndex` | The number of posts to be displayed at the home page under `Recent` section. |
-| `postPerPage` | You can specify how many posts will be displayed in each posts page. (eg: if you set SITE.postPerPage to 3, each page will only show 3 posts per page) |
-| `scheduledPostMargin` | In Production mode, posts with a future `pubDatetime` will not be visible. However, if a post's `pubDatetime` is within the next 15 minutes, it will be visible. You can set `scheduledPostMargin` if you don't like the default 15 minutes margin. |
+| Options | Description |
+| --------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `website` | Your deployed website url |
+| `author` | Your name |
+| `desc` | Your site description. Useful for SEO and social media sharing. |
+| `title` | Your site name |
+| `ogImage` | Your default OG image for the site. Useful for social media sharing. OG images can be an external image url or they can be placed under `/public` directory. |
+| `lightAndDarkMode` | Enable or disable `light & dark mode` for the website. If disabled, primary color scheme will be used. This option is enabled by default. |
+| `postPerIndex` | The number of posts to be displayed at the home page under `Recent` section. |
+| `postPerPage` | You can specify how many posts will be displayed in each posts page. (eg: if you set SITE.postPerPage to 3, each page will only show 3 posts per page) |
+| `scheduledPostMargin` | In Production mode, posts with a future `pubDatetime` will not be visible. However, if a post's `pubDatetime` is within the next 15 minutes, it will be visible. You can set `scheduledPostMargin` if you don't like the default 15 minutes margin. |
+| `editPost` | This option allows users to suggest changes to a blog post by providing an edit link under blog post titles. This feature can be disabled by removing it from the `SITE` config. You can also set `appendFilePath` to `true` to automatically append the file path of the post to the url, directing users to the specific post they wish to edit. |
## Configuring locale
diff --git a/src/content/config.ts b/src/content/config.ts
index 73867a554..dadf97a1a 100644
--- a/src/content/config.ts
+++ b/src/content/config.ts
@@ -22,6 +22,14 @@ const blog = defineCollection({
.optional(),
description: z.string(),
canonicalURL: z.string().optional(),
+ editPost: z
+ .object({
+ disabled: z.boolean().optional(),
+ url: z.string().optional(),
+ text: z.string().optional(),
+ appendFilePath: z.boolean().optional(),
+ })
+ .optional(),
}),
});
diff --git a/src/layouts/PostDetails.astro b/src/layouts/PostDetails.astro
index 8ab45a74b..29028937a 100644
--- a/src/layouts/PostDetails.astro
+++ b/src/layouts/PostDetails.astro
@@ -25,6 +25,7 @@ const {
pubDatetime,
modDatetime,
tags,
+ editPost,
} = post.data;
const { Content } = await post.render();
@@ -82,6 +83,8 @@ const nextPost =
modDatetime={modDatetime}
size="lg"
className="my-2"
+ editPost={editPost}
+ postId={post.id}
/>
diff --git a/src/types.ts b/src/types.ts
index 4f644edd3..a5fbb418f 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -11,6 +11,11 @@ export type Site = {
postPerIndex: number;
postPerPage: number;
scheduledPostMargin: number;
+ editPost?: {
+ url?: URL["href"];
+ text?: string;
+ appendFilePath?: boolean;
+ };
};
export type SocialObjects = {