Simplify PsyFlow website structure

Author: zh1peng

website/content/zh/tutorials/qa-and-validation.md

@@ -0,0 +1,81 @@
+# QA、Validation 与 Simulation
+
+PsyFlow 现在不再把 “能跑一次” 当成发布标准。当前维护中的流程把 QA、simulation 和 validation 看成三种互补的检查。
+
+- `psyflow-qa`：做一次真实的 smoke run，并生成可审查的产物
+- `psyflow-sim`：用 responder 做可重复的行为仿真
+- `psyflow-validate`：不启动任务，也能检查任务包结构、合同、配置和说明文件
+
+## QA
+
+先用 QA 跑一遍任务：
+
+```bash
+psyflow-qa path/to/task --config config/config_qa.yaml
+```
+
+默认会在 `outputs/qa/` 下面留下结构化产物，例如：
+
+- `qa_report.json`
+- `static_report.json`
+- `contract_report.json`
+- `qa_trace.csv`
+- `qa_events.jsonl`
+
+这些文件不是临时调试垃圾，而是任务评审和发布前检查的一部分。
+
+## Validation
+
+如果你只想先检查任务包，不想真正启动 PsychoPy，可以直接运行：
+
+```bash
+psyflow-validate path/to/task
+```
+
+当前 validator 会覆盖：
+
+- 配置文件和 profile 结构
+- contract manifest
+- reference artifacts
+- README 结构
+- 面向被试文本的运行时策略
+
+最后这一点很重要。PsyFlow 现在会更主动地阻止把被试可见文本硬编码进运行时代码。
+
+## Simulation
+
+如果你需要无被试的重复性测试，可以用 simulation：
+
+```bash
+psyflow-sim path/to/task --config config/config_scripted_sim.yaml
+```
+
+如果任务需要自己的 responder：
+
+```bash
+psyflow-sim path/to/task --config config/config_sampler_sim.yaml
+```
+
+## 推荐顺序
+
+一个准备发布的任务，推荐至少走一遍下面这组命令：
+
+```bash
+psyflow-run .
+psyflow-qa . --config config/config_qa.yaml
+psyflow-sim . --config config/config_scripted_sim.yaml
+psyflow-validate .
+```
+
+这样你可以分别得到：
+
+- 人工快速检查
+- QA 产物
+- responder 驱动的覆盖测试
+- 静态结构与 contract 检查
+
+## 下一步
+
+- 看 [Trigger 教程](/zh/tutorials/trigger-io/)
+- 看 [命令行与运行模式](/zh/tutorials/cli-and-runtime/)
+- 回到 [中文教程首页](/zh/tutorials/)

website/next.config.js

@@ -1,6 +1,5 @@
 /** @type {import('next').NextConfig} */
-const isPages = process.env.GITHUB_ACTIONS === "true";
-const basePath = isPages ? "/psyflow" : "";
+const basePath = "/psyflow";
 
 const nextConfig = {
   output: "export",
@@ -9,7 +8,7 @@ const nextConfig = {
     unoptimized: true
   },
   basePath,
-  assetPrefix: basePath ? `${basePath}/` : "",
+  assetPrefix: `${basePath}/`,
   env: {
     NEXT_PUBLIC_BASE_PATH: basePath
   }

website/src/app/api/page.tsx

@@ -2,58 +2,51 @@ import { changelog, siteData } from "@/lib/generated";
 
 export default function ChangelogPage() {
   return (
-    <div className="space-y-16 pb-8">
-      <section className="grid gap-10 lg:grid-cols-[minmax(0,1fr)_420px] lg:items-center">
+    <div className="space-y-12 pb-8">
+      <section className="grid gap-8 lg:grid-cols-[minmax(0,1fr)_320px] lg:items-end">
         <div>
-          <div className="pf-badge mx-auto w-fit">Changelog</div>
-          <h1 className="mt-6 max-w-3xl font-heading text-5xl font-bold leading-[0.94] text-[#25314d] sm:text-6xl">
-            Read the
-            <br />
-            <span className="text-[#39d95d]">Meaningful Changes,</span>
-            <br />
-            Not Just a Version Number.
+          <div className="pf-badge">Changelog</div>
+          <h1 className="mt-5 max-w-4xl font-heading text-5xl font-bold leading-[0.94] text-[#25314d] sm:text-6xl">
+            Read releases as one clear update at a time.
           </h1>
-          <p className="mt-6 max-w-3xl text-base leading-8 text-slate-700">
-            The published package version in pyproject is behind the current repository history. This
-            site follows the changelog and current main branch behavior instead of treating one stale
-            package number as the whole story.
+          <p className="mt-5 max-w-3xl text-base leading-8 text-slate-700">
+            This page follows the current repository history instead of over-indexing on one stale package
+            version. Each release is shown as one readable block.
           </p>
         </div>
 
-        <div className="pf-frame bg-[#fffdf9] p-6">
-          <div className="space-y-4 text-sm leading-7 text-slate-700">
-            <div className="rounded-[18px] border-2 border-[#25314d] bg-[#eef8ff] px-4 py-4 shadow-[0_4px_0_#25314d]">
-              pyproject version: {siteData.project.version ?? "unknown"}
+        <div className="pf-frame bg-[#fffdf9] p-5">
+          <div className="space-y-3 text-sm leading-7 text-slate-700">
+            <div className="rounded-[18px] border-2 border-[#25314d] bg-[#eef8ff] px-4 py-3 shadow-[0_4px_0_#25314d]">
+              Latest changelog release: {siteData.latest_release?.version ?? "unknown"}
             </div>
-            <div className="rounded-[18px] border-2 border-[#25314d] bg-[#fff3ed] px-4 py-4 shadow-[0_4px_0_#25314d]">
-              latest changelog version: {siteData.latest_release?.version ?? "unknown"}
+            <div className="rounded-[18px] border-2 border-[#25314d] bg-[#fff3ed] px-4 py-3 shadow-[0_4px_0_#25314d]">
+              Package metadata version: {siteData.project.version ?? "unknown"}
             </div>
           </div>
         </div>
       </section>
 
-      <section className="space-y-6">
+      <section className="space-y-5">
         {changelog.map((release) => (
-          <div key={release.version} className="pf-frame bg-[#fffdf9] p-6">
-            <div className="flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between">
+          <article key={release.version} className="pf-frame bg-[#fffdf9] p-6 sm:p-7">
+            <div className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
               <div>
-                <div className="rounded-full bg-[#d9edf6] px-3 py-1 text-xs font-bold text-[#25314d]">
-                  Version {release.version}
-                </div>
+                <div className="pf-section-chip bg-[#ddd7f4]">Version {release.version}</div>
                 <h2 className="mt-4 font-heading text-3xl font-bold text-[#25314d]">{release.date}</h2>
               </div>
             </div>
-            <div className="mt-6 grid gap-4 md:grid-cols-2">
+            <ul className="mt-6 space-y-3 text-sm leading-7 text-slate-700">
               {release.summary.map((item) => (
-                <div
+                <li
                   key={`${release.version}:${item}`}
-                  className="rounded-[18px] border-2 border-[#25314d] bg-white px-4 py-4 text-sm leading-6 text-slate-700 shadow-[0_4px_0_#25314d]"
+                  className="rounded-[18px] border-2 border-[#25314d] bg-white px-4 py-3 shadow-[0_4px_0_#25314d]"
                 >
                   {item}
-                </div>
+                </li>
               ))}
-            </div>
-          </div>
+            </ul>
+          </article>
         ))}
       </section>
     </div>