[add] Requirement Evaluation pages

[optimize] Service entries in Home page

Author: TechQuery

package.json

@@ -9,6 +9,7 @@
   "dependencies": {
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
+    "@giscus/react": "^3.1.0",
     "@mui/lab": "6.0.0-beta.30",
     "@mui/material": "^6.4.7",
     "@sentry/nextjs": "^9.5.0",

pages/api/home.ts

@@ -4,20 +4,24 @@ export const service = () => [
   {
     icon: 'trending_up',
     title: t('IT_transformation_consulting'),
-    summary: t('IT_transformation_consulting_summary')
+    summary: t('IT_transformation_consulting_summary'),
+    buttonText: t('read_resolution'),
+    buttonLink: 'https://idea2app.feishu.cn/wiki/RsCvwrpXPimCpRkjpsAcWl2rnJd',
   },
   {
     icon: 'code',
     title: t('custom_software_development'),
     summary: t('custom_software_development_summary'),
     buttonText: t('consult_immediately'),
-    buttonLink: 'https://wenjuan.feishu.cn/m?t=sBih7Nzwkwqi-0l12'
+    buttonLink: '/requirement',
   },
   {
     icon: 'diversity_3',
     title: t('agile_team_training'),
-    summary: t('agile_team_training_summary')
-  }
+    summary: t('agile_team_training_summary'),
+    buttonText: t('read_tutorial'),
+    buttonLink: 'https://idea2app.feishu.cn/wiki/B956wLo7wilMClkaFsScDL7DnwM',
+  },
 ];
 
 export const PARTNERS_INFO = () => [
@@ -26,47 +30,47 @@ export const PARTNERS_INFO = () => [
     logoDark: '/aiux-dark.png',
     name: t('partner_aiux'),
     address: 'https://www.aiuxdesign.com/',
-    summary: t('partner_aiux_slogan')
+    summary: t('partner_aiux_slogan'),
   },
 
   {
     logo: '/23-5.png',
     logoDark: '/23-5-dark.png',
     name: t('partner_23_5'),
     address: 'https://www.in235.com/',
-    summary: t('partner_23_5_slogan')
+    summary: t('partner_23_5_slogan'),
   },
   {
     logo: '/fcc-cdg.png',
     name: t('partner_fcc_cdg'),
     address: 'https://fcc-cd.dev/',
-    summary: t('partner_fcc_cdg_slogan')
+    summary: t('partner_fcc_cdg_slogan'),
   },
 
   {
     logo: '/ic-naming.svg',
     name: t('partner_ic_naming'),
     address: 'https://icnaming.com/',
-    summary: t('partner_ic_naming_slogan')
+    summary: t('partner_ic_naming_slogan'),
   },
 
   {
     logo: '/creator-1024.png',
     logoDark: '/creator-1024-dark.png',
     name: t('partner_creator_1024'),
     address: 'https://github.com/Creator-1024',
-    summary: t('partner_creator_1024_slogan')
+    summary: t('partner_creator_1024_slogan'),
   },
   {
     logo: '/kys.png',
     name: t('partner_kys'),
     address: 'https://kaiyuanshe.cn/',
-    summary: t('partner_kys_slogan')
+    summary: t('partner_kys_slogan'),
   },
   {
     logo: '/eth-planet.png',
     name: t('partner_eth_planet'),
     address: 'https://x.com/ethplanet/',
-    summary: t('partner_eth_planet_slogan')
-  }
+    summary: t('partner_eth_planet_slogan'),
+  },
 ];

pages/index.tsx

@@ -1,4 +1,5 @@
 import Masonry from '@mui/lab/Masonry';
+import { Button } from '@mui/material';
 import { GitRepository } from 'mobx-github';
 import { observer } from 'mobx-react';
 import { compose, errorLogger, translator } from 'next-ssr-middleware';
@@ -52,20 +53,11 @@ const HomePage: FC<HomePageProps> = observer(({ repositories, members }) => (
             <p>{t('idea2app_slogan')}</p>
 
             <p className="my-4 text-neutral-500">{t('idea2app_slogan_2')}?</p>
-
-            <a
-              className="border-b-2 border-b-black py-1 dark:border-b-white"
-              href="https://wenjuan.feishu.cn/m?t=sBih7Nzwkwqi-0l12"
-              target="_blank"
-              rel="noopener noreferrer"
-            >
-              {t('contact_us')}
-            </a>
           </header>
         </div>
 
         <ul className="grid grid-cols-1 gap-4 sm:grid-cols-3">
-          {service().map(({ title, summary, icon }) => (
+          {service().map(({ title, summary, icon, buttonText, buttonLink }) => (
             <li
               key={title}
               className="elevation-1 hover:elevation-8 flex flex-col gap-4 rounded-3xl border p-4 dark:border-0"
@@ -76,6 +68,14 @@ const HomePage: FC<HomePageProps> = observer(({ repositories, members }) => (
               </h5>
 
               <p>{summary}</p>
+
+              <Button
+                variant="contained"
+                href={buttonLink}
+                target={buttonLink.startsWith('http') ? '_blank' : undefined}
+              >
+                {buttonText}
+              </Button>
             </li>
           ))}
         </ul>

pages/requirement/[title].tsx

@@ -0,0 +1,42 @@
+import Giscus from '@giscus/react';
+import { Alert } from '@mui/material';
+import { observer } from 'mobx-react';
+import { NextPage } from 'next';
+import { compose, RouteProps, router, translator } from 'next-ssr-middleware';
+
+import { PageHead } from '../../components/PageHead';
+import { i18n, t } from '../../models/Translation';
+
+export const getServerSideProps = compose(router, translator(i18n));
+
+const RequirementDetailPage: NextPage<RouteProps<{ title: string }>> = observer(
+  ({ route: { params } }) => {
+    const title = `${params!.title} - ${t('AI_requirement_evaluation')}`;
+
+    return (
+      <div className="container mx-auto flex max-w-(--breakpoint-xl) flex-col gap-4 px-4 pt-16 pb-6">
+        <PageHead title={title}>
+          <meta property="og:title" content={params!.title} />
+        </PageHead>
+
+        <h1 className="py-10 text-center text-5xl">{title}</h1>
+
+        <Alert severity="warning">
+          <span dangerouslySetInnerHTML={{ __html: t('information_security_alert') }} />
+        </Alert>
+
+        <Giscus
+          repo="idea2app/.github"
+          repoId="R_kgDOOHPqjQ"
+          category="Ideas"
+          categoryId="DIC_kwDOOHPqjc4Cn5sg"
+          mapping="og:title"
+          emitMetadata="1"
+          lang={i18n.currentLanguage}
+        />
+      </div>
+    );
+  },
+);
+
+export default RequirementDetailPage;

pages/requirement/index.tsx

@@ -0,0 +1,35 @@
+import { Button, TextField } from '@mui/material';
+import { observer } from 'mobx-react';
+import { NextPage } from 'next';
+import { compose, translator } from 'next-ssr-middleware';
+import { formToJSON } from 'web-utility';
+
+import { PageHead } from '../../components/PageHead';
+import { i18n, t } from '../../models/Translation';
+
+export const getServerSideProps = compose(translator(i18n));
+
+const RequirementEntryPage: NextPage = observer(() => (
+  <form
+    className="container mx-auto flex max-w-max flex-col gap-4 px-4 pt-16 pb-6"
+    onSubmit={event => {
+      event.preventDefault();
+
+      const { title } = formToJSON<{ title: string }>(event.currentTarget);
+
+      location.href += `/${title}`;
+    }}
+  >
+    <PageHead title={t('AI_requirement_evaluation')} />
+
+    <h1 className="py-10 text-center text-6xl">{t('AI_requirement_evaluation')}</h1>
+
+    <TextField label={t('project_name')} name="title" required defaultValue="动物保护平台" />
+
+    <Button variant="contained" size="large" type="submit">
+      {t('AI_requirement_evaluation')}
+    </Button>
+  </form>
+));
+
+export default RequirementEntryPage;

pnpm-lock.yaml

@@ -8,13 +8,15 @@ export default {
   IT_transformation_consulting: 'IT transformation consulting',
   IT_transformation_consulting_summary:
     'Help you sort out business processes, discover the pain points of Improving Efficiency & Reducing Costs", and tailor IT Transformation solutions',
+  read_resolution: 'Read resolution',
   custom_software_development: 'Custom software development',
   custom_software_development_summary:
     'Front-line engineers efficiently deliver Software systems based on Industry-leading technologies, allowing you to spend your money wisely',
+  consult_immediately: 'Consult immediately',
   agile_team_training: 'Agile team training',
   agile_team_training_summary:
     'Face-to-face with your technical team to learn Agile Development methodology from practice, and grow into a reliable and efficient Modern Engineering Team',
-  consult_immediately: 'Consult immediately',
+  read_tutorial: 'Read tutorial',
   latest_projects: 'Latest projects',
   welcome_to: 'Welcome to',
   get_started_by_editing: 'Get started by editing',
@@ -64,5 +66,11 @@ export default {
 
   // Open source project
   load_more: 'Load more...',
-  no_more: 'No more'
+  no_more: 'No more',
+
+  // Requirement Evaluation
+  AI_requirement_evaluation: '🤖 Requirement Evaluation',
+  information_security_alert:
+    'This service is free of charge, but only accepts <strong>publicly available information</strong> related to estimation.',
+  project_name: 'Project Name',
 } as const;