---
import BaseLayout from "../../layouts/BaseLayout.astro";
import PageHero from "../../components/PageHero.astro";
import ContactPanel from "../../components/ContactPanel.astro";
import { jobs } from "../../data/site";

export function getStaticPaths() {
  return jobs.flatMap((job) => {
    const paths = [job.slug, ...job.aliases];
    return paths.map((slug) => ({
      params: { slug },
      props: { job, slug },
    }));
  });
}

const { job, slug } = Astro.props;
const isAlias = slug !== job.slug;
---

<BaseLayout
  title={job.title}
  description={`${job.title} bei der Heinz Heidrich GmbH in Tostedt. Start: ${job.start}.`}
  canonical={`/job/${job.slug}/`}
  noindex={isAlias}
>
  <PageHero
    title={job.title}
    kicker="Stellenangebot"
    text={job.intro}
    image={job.image}
    alt=""
  />

  <section class="section">
    <div class="container job-layout">
      <article class="job-content">
        <div class="job-hero">
          <img src={job.image} alt="" width="1000" height="400" />
        </div>

        <section class="copy-stack">
          <h2>Über uns</h2>
          <p>Sie sind auf der Suche nach beruflicher Veränderung? Dann melden Sie sich, um Teil unseres Teams zu werden.</p>
          <p>Die Firma Heinz Heidrich GmbH wurde 1963 vom Dachdeckermeister Heinz Heidrich gegründet. Das Geschäft wird seit 1995 von Christian und Heiner Heidrich weitergeführt, beide Dachdecker- und Klempnermeister. Seit Gründung des Betriebes wird besonderer Wert auf solide und qualitativ hochwertige Arbeiten gelegt.</p>
          <p>Unser Arbeitsbereich erstreckt sich auf den Großraum Hamburg, Schleswig-Holstein und Niedersachsen.</p>
        </section>

        <section class="copy-stack">
          <h2>Qualifikationen und Anforderungen</h2>
          <ul class="check-list">
            {job.requirements.map((item) => <li>{item}</li>)}
          </ul>
        </section>

        <section class="copy-stack">
          <h2>Was wir bieten</h2>
          <ul class="check-list">
            {job.benefits.map((item) => <li>{item}</li>)}
          </ul>
        </section>
      </article>

      <div class="sticky-side">
        <ContactPanel
          application
          title="Jetzt bewerben"
          text="Ansprechpartner: Christian und Heiner Heidrich. Schicken Sie uns Ihre Bewerbung gern per E-Mail."
        />
      </div>
    </div>
  </section>
</BaseLayout>
