import PageHeading from '../ui/PageHeading'
import '../welcome.css'

export default function HowItWorksPage() {
  return <main className="friendly-guide">
    <PageHeading title="A little help getting started." description="Magent looks after your requests. GrizzlyFlix is where you watch them." />
    <nav aria-label="Quick links"><a href="/welcome">Welcome page</a><a href="/">My Requests</a><a href="/profile">My profile</a></nav>
    <details open><summary>Request a movie or TV show</summary>
      <ol>
        <li><strong>Choose Movie or TV show.</strong><p>Open <a href="/new-requests">02 New Requests</a> and pick what you’re looking for.</p></li>
        <li><strong>Search and choose the right title.</strong><p>For TV, choose the seasons you want. If it’s already requested, open that request to see its progress.</p></li>
        <li><strong>Check your choices and send it.</strong><p>Choose from the quality options shown. These come from the library’s settings.</p></li>
        <li><strong>Follow it in My Requests.</strong><p>We’ll show what’s happening and any next step you can take. Some titles need approval or may not have a suitable download yet.</p></li>
      </ol>
    </details>
    <details><summary>Understand the six progress steps</summary>
      <ol>
        <li><strong>Requested:</strong> Your request has been received.</li>
        <li><strong>Approved:</strong> It has permission to go ahead.</li>
        <li><strong>Library collection:</strong> The library is tracking what’s collected and what’s missing.</li>
        <li><strong>Release search:</strong> A suitable download is being looked for. Waiting here can mean there isn’t a good match yet.</li>
        <li><strong>Download:</strong> The files are being downloaded. TV requests can include several episodes or a season pack.</li>
        <li><strong>Available to watch:</strong> GrizzlyFlix has added the content. Use the watch button to open it.</li>
      </ol>
      <p>A finished download still needs to be added to the media library. Wait for “Available to watch” before heading over.</p>
    </details>
    <details><summary>Something looks stuck</summary>
      <ol>
        <li><strong>Open the request.</strong><p>Read its current status and next step.</p></li>
        <li><strong>Choose Recheck request.</strong><p>Magent checks the connected services again to refresh where things are up to.</p></li>
        <li><strong>Follow the action offered.</strong><p>You may be able to restart a search or review suitable releases. Choose “Best pick” when offered if you’re unsure.</p></li>
      </ol>
      <p>Remote activity explains the latest check. Open it to see the full list. A successful search doesn’t always mean a download was found.</p>
    </details>
    <details><summary>Report a problem and follow the fix</summary>
      <ol>
        <li><strong>Open <a href="/portal/issues">03 Issues</a>.</strong><p>Choose what’s wrong: missing content, broken picture, wrong download, audio, subtitles, or playback.</p></li>
        <li><strong>Choose the affected content.</strong><p>Find the movie or show. For TV, select the affected seasons or episodes; you can choose more than one.</p></li>
        <li><strong>Read “What will happen”, then submit.</strong><p>It tells you whether the selected files will be replaced, missing content searched for, subtitles checked, or playback investigated.</p></li>
        <li><strong>Follow the issue’s progress.</strong><p>Open your reported issue to see the work recorded and where the fix is up to.</p></li>
        <li><strong>Tell us if it worked.</strong><p>When a supported repair is detected as ready to check, Magent can email you. Try the content, then choose “Yes” if it’s fixed or “No” if you still need help.</p></li>
      </ol>
      <p>Add your email in <a href="/profile">My profile</a> so updates can reach you. Reminder and automatic closure timings depend on the site’s settings.</p>
    </details>
    <details><summary>Invite someone</summary>
      <ol>
        <li><strong>Open <a href="/profile/invites">04 Invites</a>.</strong><p>If invites are enabled for your account, give your invite a name you’ll recognise.</p></li>
        <li><strong>Add a welcome note, or skip it.</strong><p>A custom invite code is optional too.</p></li>
        <li><strong>Choose how to share it.</strong><p>Copy the link yourself, or enter an email address to send it directly.</p></li>
        <li><strong>Manage it later.</strong><p>You can return to your invites to check them or disable a link. Your account’s invite limits apply automatically.</p></li>
      </ol>
    </details>
    <details><summary>Update your account</summary><p>Open the account menu and choose <a href="/profile">My profile</a> to update your contact email, view your activity, or use the password options available for your account.</p><p>Looking for your downloads instead? <a href="/">01 My Requests</a> is your starting point.</p></details>
    <footer>Ready? <a href="/welcome">Choose where to go next →</a></footer>
  </main>
}