✨ Migrate legals

app/information/[id]/community-guidelines.mdx

@@ -0,0 +1,49 @@
+export const metadata = {
+  title: "社区准则"
+}
+
+Welcome to our community! We are committed to fostering an open, friendly, and respectful environment to facilitate meaningful communication and shared experiences. Please adhere to the following community guidelines to ensure that every member can enjoy a positive and enriching community experience.
+
+## 1. Respect Others
+
+Ensure that your words and actions respect fellow community members. Avoid the use of insulting, discriminatory, or offensive language. Respect others' viewpoints, even if you disagree. Engage in discussions constructively to foster understanding and knowledge sharing.
+
+## 2. Maintain Friendliness and Inclusivity
+
+We welcome members from diverse cultures, backgrounds, and perspectives. Ensure that your interactions are friendly and inclusive. Refrain from posting offensive or discriminatory content. Help us create an environment that accommodates a variety of opinions and ideas.
+
+## 3. Respect Privacy
+
+Respect the privacy of other members. Avoid sharing others' personal information without their consent. If you need to share information related to others, ensure you have obtained their permission.
+
+## 4. Inappropriate Content and Behavior
+
+Refrain from posting any illegal, obscene, threatening, or otherwise inappropriate content. This includes but is not limited to explicit material, hate speech, false information, or any behavior that violates laws and ethical standards.
+
+## 5. Provide Valuable Contributions
+
+Share meaningful and valuable content within the community. Avoid posting unrelated or repetitive information. Maintain the quality of discussions and provide helpful insights and experiences for other members.
+
+## 6. Respect Administrators and Moderators
+
+Follow the guidance and rules provided by administrators and moderators. Their goal is to maintain community order and ensure a pleasant experience for every member. If you have any questions or concerns, feel free to contact them privately.
+
+## 7. Respect Diverse Political Views
+
+We encourage the respectful sharing of diverse political views. However, express your opinions in a way that respects others, avoiding offensive, provocative, or insulting language. Political discussions should be conducted constructively to promote understanding and information sharing.
+
+## 8. Adhere to International Political Standards
+
+Our community consists of members from around the world with different political beliefs. Understand and respect international political viewpoints, avoiding conflicts arising from political stances. Keep an open mind and be willing to listen and learn from diverse cultural and national perspectives.
+
+## 9. Comply with Legal Regulations
+
+Any form of illegal behavior is unacceptable in our community. Ensure that your words and actions comply with local and international laws, especially in matters related to politics. Prohibitions include incitement, advocating violence, or any other unlawful activities.
+
+## 10. Avoid Improper Political Promotion
+
+Avoid engaging in inappropriate political promotion within the community. The community is intended for constructive exchange, not as a platform for political propaganda. Respect the preferences of other members and refrain from forcefully advocating personal or group political stances.
+
+We believe that by adhering to these guidelines, we can create an inclusive community rich in diverse perspectives. Violations may result in appropriate sanctions, and the specific consequences will depend on the severity and frequency of the violations.
+
+Thank you for your cooperation in maintaining an open and friendly atmosphere in our community, providing an enjoyable communication experience for all members!

app/information/[id]/layout.tsx

@@ -0,0 +1,17 @@
+"use client";
+
+import { Box, Card, CardContent, Container } from "@mui/material";
+import { ReactNode } from "react";
+
+
+export default function LegalLayout({ children }: Readonly<{
+  children: ReactNode;
+}>) {
+  return (
+    <Container sx={{ display: "flex", justifyContent: "center", gap: 4, py: 2 }}>
+      <Card sx={{ flexGrow: 1, maxWidth: 720 }}>
+        {children}
+      </Card>
+    </Container>
+  );
+}

app/information/[id]/page.tsx

@@ -0,0 +1,55 @@
+import { ReactNode } from "react";
+import { notFound } from "next/navigation";
+import { Box, CardContent, Divider, Typography } from "@mui/material";
+import UserAgreement from "@/app/information/[id]/user-agreement.mdx";
+import PrivacyPolicy from "@/app/information/[id]/privacy-policy.mdx";
+import CommunityGuidelines from "@/app/information/[id]/community-guidelines.mdx";
+
+interface InfoMeta {
+  title: string;
+  content: ReactNode;
+  updatedAt: Date;
+}
+
+const INFO_DIRECTORY: { [id: string]: InfoMeta } = {
+  "user-agreement": {
+    title: "User Agreement",
+    content: <UserAgreement />,
+    updatedAt: new Date("2019-01-28 01:28")
+  },
+  "privacy-policy": {
+    title: "Privacy Policy",
+    content: <PrivacyPolicy />,
+    updatedAt: new Date("2019-01-28 01:28")
+  },
+  "community-guidelines": {
+    title: "Goatworks Community Guidelines",
+    content: <CommunityGuidelines />,
+    updatedAt: new Date("2019-01-28 01:28")
+  }
+};
+
+export default function InfoPage({ params }: { params: { id: string } }) {
+  const info = INFO_DIRECTORY[params.id];
+
+  if (!info) {
+    return notFound();
+  }
+
+  return (
+    <CardContent sx={{ paddingX: 5, paddingY: 3 }}>
+      <Typography variant="h2">
+        {info.title}
+      </Typography>
+      <Typography color="text.secondary" variant="body2" sx={{ mt: 0.25 }}>
+        Last Updated At: {info.updatedAt.toLocaleString()}
+      </Typography>
+
+
+      <Divider sx={{ my: 2.5, mx: -5 }} />
+      <Box className="prose max-w-none">
+        {info.content}
+      </Box>
+    </CardContent>
+  );
+}

app/information/[id]/privacy-policy.mdx

@@ -0,0 +1,52 @@
+export const metadata = {
+  title: "隐私协议"
+}
+
+SmartSheep Studio (referred to as "we," "our," or "the Studio") respects and protects your personal privacy. This Privacy Policy is intended to explain our practices regarding the collection, use, sharing, and protection of your personal information. Please read this Privacy Policy carefully to understand how we handle your personal information.
+
+## 1. Information Collection
+
+We may collect various types of information, including but not limited to:
+
+*   Personal identification information (e.g., name, address, email address, phone number, etc.)
+*   Device information (e.g., IP address, operating system, browser type, etc.)
+*   Usage data (e.g., access times, browsing history, clickstream data, etc.)
+
+We may collect information through various methods, including:
+
+*   Information you provide (e.g., account registration, form submissions, etc.)
+*   Automatically collected information (e.g., through Cookies, Web Beacons, etc.)
+
+## 2. Information Use
+
+We may use your personal information for various purposes, including:
+
+*   Providing requested products or services
+*   Processing transactions and payments
+*   Sending relevant notifications
+*   Providing customer support and services
+*   Improving our products and services
+
+## 3. Information Sharing
+
+We may share your personal information with third parties, including but not limited to:
+
+*   Business partners
+*   Third-party service providers
+*   When required by law or government agencies
+
+## 4. Information Security
+
+We will take reasonable security measures to protect your personal information from unauthorized access, use, or disclosure. However, please note that no method of transmission over the internet is 100% secure.
+
+## 5. Changes to Privacy Policy
+
+We reserve the right to modify this Privacy Policy at any time. The updated policy will be posted on our website and will become effective upon posting. Please check our Privacy Policy regularly for updates.
+
+## 6. Contact Us
+
+If you have any questions or concerns about our Privacy Policy, please contact us at:
+
+alphabot@smartsheep.studio
+
+Thank you for reading our Privacy Policy.

app/information/[id]/user-agreement.mdx

@@ -0,0 +1,47 @@
+export const metadata = {
+  title: "用户协议"
+}
+
+Please read this user agreement carefully before using our product/service. By using our product/service, you agree to comply with the following terms and conditions:
+
+## 1. User Content
+
+1.1 You are solely responsible for any text, images, audio, video, or other materials (collectively referred to as "User Content") you upload, publish, or share through our product/service.
+
+1.2 You warrant that you are the lawful owner of all User Content you upload, or you have obtained all necessary authorizations and licenses to use and share such User Content on our product/service.
+
+1.3 You agree not to upload, publish, or share any User Content that is illegal, infringing, obscene, threatening, defamatory, or otherwise violates applicable laws.
+
+## 2. Community Guidelines and Service Termination
+
+2.1 You must adhere to our community guidelines, which include but are not limited to [Goatworks Community Guidelines](/legal/community-guidelines).
+
+2.2 Violation of the community guidelines may result in our sole discretion to delete, modify, or refuse acceptance of any User Content and may lead to termination or suspension of your access to our product/service.
+
+2.3 We reserve the right to modify the community guidelines at any time, and you agree to comply with the latest community guidelines.
+
+## 3. Legal Responsibility
+
+3.1 We do not assume any responsibility for the legality, accuracy, completeness, or quality of User Content.
+
+3.2 You agree to bear all legal responsibilities arising from your User Content, including but not limited to claims, lawsuits, losses, and expenses incurred by third parties.
+
+3.3 We are not liable for any losses or damages caused by User Content, including but not limited to direct or indirect special, incidental, consequential, or punitive damages.
+
+## 4. User Responsibilities
+
+4.1 You agree to maintain the confidentiality of your account and password and assume full responsibility for all activities conducted through your account.
+
+4.2 You agree to promptly notify us of any unauthorized use of your account or other security vulnerabilities.
+
+## 5. Termination
+
+We reserve the right to terminate or suspend your access to our product/service at any time without prior notice if we believe you have violated any provisions of this user agreement or community guidelines.
+
+## 6. Contact Us
+
+If you have any questions about this user agreement, please contact us at:
+
+alphabot@smartsheep.studio
+
+Thank you for reading and complying with our user agreement.

app/layout.tsx

@@ -36,7 +36,7 @@ export default function RootLayout({ children }: Readonly<{
     <AppRouterCacheProvider>
       <CssBaseline />
       <SpeedInsights />
-      <NextTopLoader color="#ffffff" />
+      <NextTopLoader color="#ffffff" showSpinner={false} />
       <ThemeProvider theme={theme}>
         <AppShell>{children}</AppShell>
       </ThemeProvider>

components/NavigationDrawer.tsx

@@ -3,7 +3,7 @@
 import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
 import ChevronRightIcon from "@mui/icons-material/ChevronRight";
 import {
-  Box,
+  Box, Collapse,
   Divider,
   Drawer,
   IconButton,
@@ -12,13 +12,19 @@ import {
   ListItemIcon,
   ListItemText,
   styled,
-  useMediaQuery,
+  useMediaQuery
 } from "@mui/material";
 import { theme } from "@/app/theme";
-import { ReactNode } from "react";
+import { Fragment, ReactNode, useState } from "react";
 import HomeIcon from "@mui/icons-material/Home";
 import ArticleIcon from "@mui/icons-material/Article";
 import FeedIcon from "@mui/icons-material/RssFeed";
+import InfoIcon from '@mui/icons-material/Info';
+import GavelIcon from '@mui/icons-material/Gavel';
+import PolicyIcon from '@mui/icons-material/Policy';
+import SupervisedUserCircleIcon from '@mui/icons-material/SupervisedUserCircle';
+import ExpandLess from "@mui/icons-material/ExpandLess";
+import ExpandMore from "@mui/icons-material/ExpandMore";
 import Link from "next/link";
 
 export interface NavigationItem {
@@ -26,14 +32,22 @@ export interface NavigationItem {
   title?: string;
   link?: string;
   divider?: boolean;
+  children?: NavigationItem[];
 }
 
 export const DRAWER_WIDTH = 320;
 export const NAVIGATION_ITEMS: NavigationItem[] = [
   { icon: <HomeIcon />, title: "首页", link: "/" },
   { icon: <ArticleIcon />, title: "新闻", link: "/posts" },
+  {
+    icon: <InfoIcon />, title: "信息中心", children: [
+      { icon: <GavelIcon />, title: "用户协议", link: "/i/user-agreement" },
+      { icon: <PolicyIcon />, title: "隐私协议", link: "/i/privacy-policy" },
+      { icon: <SupervisedUserCircleIcon />, title: "社区准则", link: "/i/community-guidelines" }
+    ]
+  },
   { divider: true },
-  { icon: <FeedIcon />, title: "订阅源", link: "/feed" },
+  { icon: <FeedIcon />, title: "订阅源", link: "/feed" }
 ];
 
 export const AppNavigationHeader = styled("div")(({ theme }) => ({
@@ -42,7 +56,7 @@ export const AppNavigationHeader = styled("div")(({ theme }) => ({
   padding: theme.spacing(0, 1),
   justifyContent: "flex-start",
   height: 64,
-  ...theme.mixins.toolbar,
+  ...theme.mixins.toolbar
 }));
 
 export function AppNavigation({ showClose, onClose }: { showClose?: boolean; onClose: () => void }) {
@@ -58,16 +72,41 @@ export function AppNavigation({ showClose, onClose }: { showClose?: boolean; onC
       <Divider />
       <List>
         {NAVIGATION_ITEMS.map((item, idx) => {
-          return item.divider ? (
+          if (item.divider) {
-            <Divider key={idx} />
+            return <Divider key={idx} sx={{ my: 1 }} />;
-          ) : (
+          } else if (item.children) {
-            <Link key={idx} href={item.link ?? "/"} passHref>
+            const [open, setOpen] = useState(false);
+            return (
+              <Fragment key={idx}>
+                <ListItemButton onClick={() => setOpen(!open)}>
+                  <ListItemIcon>{item.icon}</ListItemIcon>
+                  <ListItemText primary={item.title} />
+                  {open ? <ExpandLess /> : <ExpandMore />}
+                </ListItemButton>
+                <Collapse in={open} timeout="auto" unmountOnExit>
+                  <List component="div" disablePadding>
+                    {item.children.map((item, idx) => item.divider ? (
+                      <Divider key={idx} />
+                    ) : (
+                      <Link key={idx} href={item.link ?? "/"} passHref>
+                        <ListItemButton sx={{ pl: 4 }}>
+                          <ListItemIcon>{item.icon}</ListItemIcon>
+                          <ListItemText primary={item.title} />
+                        </ListItemButton>
+                      </Link>
+                    ))}
+                  </List>
+                </Collapse>
+              </Fragment>
+            );
+          } else {
+            return <Link key={idx} href={item.link ?? "/"} passHref>
               <ListItemButton>
                 <ListItemIcon>{item.icon}</ListItemIcon>
                 <ListItemText primary={item.title} />
               </ListItemButton>
-            </Link>
+            </Link>;
-          );
+          }
         })}
       </List>
     </>
@@ -91,8 +130,8 @@ export default function NavigationDrawer({ open, onClose }: { open: boolean; onC
         sx={{
           "& .MuiDrawer-paper": {
             boxSizing: "border-box",
-            width: DRAWER_WIDTH,
+            width: DRAWER_WIDTH
-          },
+          }
         }}
       >
         <AppNavigation onClose={onClose} />
@@ -107,8 +146,8 @@ export default function NavigationDrawer({ open, onClose }: { open: boolean; onC
         width: DRAWER_WIDTH,
         flexShrink: 0,
         "& .MuiDrawer-paper": {
-          width: DRAWER_WIDTH,
+          width: DRAWER_WIDTH
-        },
+        }
       }}
     >
       <AppNavigation showClose onClose={onClose} />

mdx-components.tsx

@@ -0,0 +1,7 @@
+import type { MDXComponents } from "mdx/types";
+
+export function useMDXComponents(components: MDXComponents): MDXComponents {
+  return {
+    ...components
+  };
+}

next.config.mjs

@@ -1,3 +1,5 @@
+import mdx from "@next/mdx";
+
 /** @type {import("next").NextConfig} */
 const nextConfig = {
   pageExtensions: ["js", "jsx", "mdx", "ts", "tsx"],
@@ -5,9 +7,9 @@ const nextConfig = {
     remotePatterns: [
       {
         protocol: "https",
-        hostname: "**",
+        hostname: "**"
-      },
+      }
-    ],
+    ]
   },
   async rewrites() {
     return [
@@ -16,8 +18,9 @@ const nextConfig = {
       { source: "/feed.xml", destination: "/feed" },
 
       { source: "/p/:id", destination: "/posts/:id" },
+      { source: "/i/:id", destination: "/information/:id" }
     ];
-  },
+  }
 };
 
-export default nextConfig;
+export default mdx()(nextConfig);

tailwind.config.ts

@@ -6,6 +6,11 @@ const config: Config = {
     "./components/**/*.{js,ts,jsx,tsx,mdx}",
     "./app/**/*.{js,ts,jsx,tsx,mdx}",
   ],
+  theme: {
+    fontFamily: {
+      sans: ["Roboto", "sans"]
+    }
+  },
   plugins: [require("@tailwindcss/typography")],
 };
 export default config;