From df55d63f99d545cb0b18c172a1f9937412a0c35b Mon Sep 17 00:00:00 2001
From: MartinBraquet <martin.braquet@gmail.com>
Date: Mon, 20 Oct 2025 13:31:58 +0200
Subject: [PATCH] Add security and help pages

---
 web/pages/help.tsx         | 78 ++++++++++++++++++++++++++++++++++++++
 web/pages/organization.tsx |  2 +
 web/pages/security.tsx     | 78 ++++++++++++++++++++++++++++++++++++++
 3 files changed, 158 insertions(+)
 create mode 100644 web/pages/help.tsx
 create mode 100644 web/pages/security.tsx

diff --git a/web/pages/help.tsx b/web/pages/help.tsx
new file mode 100644
index 00000000..1cb90e87
--- /dev/null
+++ b/web/pages/help.tsx
@@ -0,0 +1,78 @@
+import {LovePage} from 'web/components/love-page'
+import {SEO} from 'web/components/SEO'
+import Link from 'next/link'
+import {Col} from 'web/components/layout/col'
+import {Row} from 'web/components/layout/row'
+
+export default function HelpPage() {
+  return (
+    <LovePage trackPageView={'help'} className={'relative p-2 sm:pt-0'}>
+      <SEO title={`Help`} description={'Get help with Compass'} url={`/help`}/>
+      <Col className="max-w-3xl w-full mx-auto gap-6 custom-link">
+        <h1 className="text-3xl font-semibold">Help & Support</h1>
+        <p className="text-ink-700">
+          Run into a problem or have a question? This page lists the quickest ways to get help and find answers.
+        </p>
+
+        <section className="space-y-2">
+          <h2 className="text-xl font-semibold">Quick links</h2>
+          <ul className="list-disc ml-6 space-y-1">
+            <li>
+              Read the <Link href="/faq">FAQ</Link> for common questions
+            </li>
+            <li>
+              Contact us via the <Link href="/contact">contact form</Link>
+            </li>
+            <li>
+              Review our <Link href="/privacy">Privacy Policy</Link> and <Link href="/terms"
+                                                                                                    >Terms
+              of Service</Link>
+            </li>
+          </ul>
+        </section>
+
+        <section className="space-y-2">
+          <h2 className="text-xl font-semibold">Report a problem</h2>
+          <p>
+            If something isn’t working as expected, please include as much detail as possible (what you did, what you
+            expected, what happened instead, any screenshots). The fastest way to reach us is the{' '}
+            <Link href="/contact">contact form</Link>.
+          </p>
+        </section>
+
+        <section className="space-y-2">
+          <h2 className="text-xl font-semibold">Account and profile issues</h2>
+          <ul className="list-disc ml-6 space-y-1">
+            <li>Can’t sign in? Try signing out and back in, or refresh the page and try again.</li>
+            <li>Profile updates not showing? Give it a few seconds and refresh. If the issue persists, let us know via
+              the contact form.
+            </li>
+            <li>
+              Want to delete your account? Go to your profile settings, click the three dots menu in the top right,
+              and select "Delete Account"
+            </li>
+          </ul>
+        </section>
+
+        <section className="space-y-2">
+          <h2 className="text-xl font-semibold">Security</h2>
+          <p>
+            If you believe you’ve found a security vulnerability, please report it responsibly. See our{' '}
+            <Link href="/security">Security Policy</Link> for details and how to contact us.
+          </p>
+        </section>
+
+        <section className="space-y-2">
+          <h2 className="text-xl font-semibold">Still need help?</h2>
+          <Row className="flex-wrap gap-3">
+            <Link href="/contact" className="px-3 py-2 rounded-md border border-primary-600 text-ink-700 hover:bg-primary-50">Contact
+              us</Link>
+            <Link href="/faq"
+                  className="px-3 py-2 rounded-md border border-primary-600 text-primary-700 hover:bg-primary-50">Browse
+              FAQ</Link>
+          </Row>
+        </section>
+      </Col>
+    </LovePage>
+  )
+}
diff --git a/web/pages/organization.tsx b/web/pages/organization.tsx
index 8bf47ca3..dff8cb25 100644
--- a/web/pages/organization.tsx
+++ b/web/pages/organization.tsx
@@ -15,12 +15,14 @@ export default function Organization() {
         )}
       >
         <GeneralButton url={'/support'} content={'Support'}/>
+        <GeneralButton url={'/help'} content={'Help'}/>
         <GeneralButton url={'/constitution'} content={'Constitution'}/>
         <GeneralButton url={'/vote'} content={'Proposals'}/>
         <GeneralButton url={'/financials'} content={'Financials'}/>
         <GeneralButton url={'/stats'} content={'Growth & Stats'}/>
         <GeneralButton url={'/terms'} content={'Terms and Conditions'}/>
         <GeneralButton url={'/privacy'} content={'Privacy Policy'}/>
+        <GeneralButton url={'/security'} content={'Security'}/>
         <GeneralButton url={'/contact'} content={'Contact'}/>
       </Col>
     </LovePage>
diff --git a/web/pages/security.tsx b/web/pages/security.tsx
new file mode 100644
index 00000000..9aa74099
--- /dev/null
+++ b/web/pages/security.tsx
@@ -0,0 +1,78 @@
+import {LovePage} from 'web/components/love-page'
+import {SEO} from 'web/components/SEO'
+import Link from 'next/link'
+import {Col} from 'web/components/layout/col'
+import {Row} from 'web/components/layout/row'
+
+export default function SecurityPage() {
+  const email = 'hello@compassmeet.com'
+  const mailto = `mailto:${email}?subject=${encodeURIComponent('Security vulnerability report')}`
+
+  return (
+    <LovePage trackPageView={'security'} className={'relative p-2 sm:pt-0'}>
+      <SEO
+        title={`Security`}
+        description={'Report security vulnerabilities to the Compass team'}
+        url={`/security`}
+      />
+      <Col className="max-w-3xl w-full mx-auto gap-6 custom-link">
+        <h1 className="text-3xl font-semibold">Security</h1>
+        <p className="text-ink-700">
+          We take the security of our community seriously. If you believe you have found a vulnerability
+          or security issue, please report it responsibly so we can investigate and fix it quickly.
+        </p>
+
+        <section className="space-y-2">
+          <h2 className="text-xl font-semibold">How to report</h2>
+          <p>
+            Please do not open public GitHub issues for security reports. Instead, contact us directly via one of the following:
+          </p>
+          <ul className="list-disc ml-6 space-y-1">
+            <li>
+              Use the <Link href="/contact">contact form</Link> and choose the security category if available.
+            </li>
+            <li>
+              Email us at <a href={mailto}>{email}</a>.
+            </li>
+          </ul>
+        </section>
+
+        <section className="space-y-2">
+          <h2 className="text-xl font-semibold">What to include</h2>
+          <p>
+            To help us triage and resolve the issue quickly, please include:
+          </p>
+          <ul className="list-disc ml-6 space-y-1">
+            <li>A clear description of the issue and potential impact</li>
+            <li>Steps to reproduce (URLs, test accounts, exact requests/responses if applicable)</li>
+            <li>Any screenshots, videos, or proof-of-concept code</li>
+            <li>Your operating system, browser, and environment details</li>
+          </ul>
+        </section>
+
+        <section className="space-y-2">
+          <h2 className="text-xl font-semibold">Our response</h2>
+          <p>
+            We aim to acknowledge new security reports within a few business days and will keep you updated as we investigate and remediate.
+            Timeframes may vary based on severity and complexity.
+          </p>
+        </section>
+
+        <section className="space-y-2">
+          <h2 className="text-xl font-semibold">Out of scope</h2>
+          <p>
+            Please avoid tests that could degrade service for other users (e.g., denial of service) or that involve accessing another user’s data without explicit permission.
+          </p>
+        </section>
+
+        <section className="space-y-2">
+          <h2 className="text-xl font-semibold">Get in touch</h2>
+          <Row className="flex-wrap gap-3">
+            <Link href="/contact" className="px-3 py-2 rounded-md border border-primary-600 text-ink-700 hover:bg-primary-50">Contact form</Link>
+            <a href={mailto} className="px-3 py-2 rounded-md border border-primary-600 text-ink-700 hover:bg-primary-50">Email {email}</a>
+          </Row>
+        </section>
+      </Col>
+    </LovePage>
+  )
+}