web2.0-frontend/src/views/FreshmenPage/FreshmenPageView.tsx

import React from "react";
import Image from "next/legacy/image";
import styled from "styled-components";
import {
  CTASection, TextSection, InfoBox, PageLink, Link,
} from "@components/index";
import FreshmenPageHero from "./FreshmenPageHero";

const FUKSI_POINTS_LINK = "https://static.sahkoinsinoorikilta.fi/FTMK/Fuksipisteohje.pdf";
const TG_GROUP_CHAT_LINK = "https://t.me/+U8dQfkCWBaIxMDc0";
const TG_NOTIFICATIONS_LINK = "https://t.me/+IcZONKWXiNNkODRk";
const EMAIL_LINK = "ftmk@sahkoinsinoorikilta.fi";
const EMAIL_LINK_MAILTO = `mailto:${EMAIL_LINK}`;

const ImageContainer = styled.div`
  width: 100%;
  display: block;
  margin: auto;
`;

const QRImages = styled.img`
  width: 10em;
  height: 10em;
`;

const FopasImage = styled.img`
  width: 15em;
  margin-bottom: 1em;
`;

const FreshmenPageView: React.FC = () => (
  <>
    <FreshmenPageHero />
    <TextSection>
      <h3 id="abeille">Onnittelut hyvästä opiskeluvalinnasta</h3>
      <div>
        <p>
          Olet tehnyt upean valinnan ottamalla askeleen matkalla, jossa sinusta ensin kehkeytyy teekkari ja myöhemmin diplomi-insinööri.
          Sinusta on juuri tullut tekniikan ylioppilas ja fuksi.
          Hieno saavutus, jota tietysti on syytä juhlia, ja tähän juhlaan paras sijainti on ehdottomasti Otaniemi.
          Tervetuloa!
        </p>
        <p>
          Ensi askeleina suosittelemme, että liityt teille fukseille tehdyille Telegram-kanaville.
          {" "}
          <Link to={TG_GROUP_CHAT_LINK} target="_blank">Tästä</Link> pääset tutustumaan fuksikavereihisi sekä ISOihin ja <Link to={TG_NOTIFICATIONS_LINK} target="_blank">tästä</Link> pääset tiedotuskanavalle.
        </p>

        <h6>Matka nimeltä Teekkarius</h6>
        <p>
          Teekkarin matka on jokaiselle oman näköisensä.
          Kilta, ylioppilaskunta ja Otaniemen muut järjestöt tarjoavat varmasti jokaiselle omanlaista tekemistä ja harrastusta.
          Olet nyt osa Aalto-yliopiston Sähköinsinöörikiltaa ja me tulemme tukemaan sinua teekkariuden matkalla, jotta löydät juuri sinulle sopivat paikat, joissa vaikuttaa ja harrastaa.
          Jotta tämä onnistuisi, olemme esimerkiksi sijoittaneet sinut fuksiryhmään, johon tulet Orientaatioviikolla tutustumaan ja josta saat oman tukiryhmän uusiin seikkailuihin.
          Fuksiryhmääsi kuuluu myös muutama ISO.
          Heistä löydät lisää tietoa <Link to="#isot">alempaa</Link>.
        </p>

        <ImageContainer>
          <Image
            src="https://static.sahkoinsinoorikilta.fi/FTMK/IMG_6539.JPG"
            alt="Kipparit"
            layout="responsive"
            width={100}
            height={80}
            objectFit="contain"
          />
        </ImageContainer>

        <h6>Fuksikapteenit</h6>
        <p>
          Me olemme fuksikapteenisi <strong>Aura</strong> ja <strong>Antti</strong> ja tulemme olemaan tukenasi sekä valvomassa suorituksiasi fuksivuoden seikkailuissa kohti teekkarilakkia,
          jonka voit ansaita mahdollisesti järjestettävänä Wappuna ensi keväällä.
          Jos sinulla on mitään kysymyksiä, ota ihmeessä meihin yhteyttä esimerkiksi <Link to={TG_GROUP_CHAT_LINK} target="_blank">Telegramissa</Link> tai <a href={EMAIL_LINK_MAILTO}>sähköpostitse</a>.
        </p>

        <h6>Hymyillään, kun tavataan!</h6>
        <p>
          Vaikka ensimmäiset päivät Otaniemessä saattavatkin tuoda tullessaan hupsuja ja kummallisia kokemuksia, älä säikähdä niitä!
          Ajan myötä palapelin palat muodostavat sinun näköisesi kuvan ja pääset itse vaikuttamaan siihen, miltä lopputulos näyttää.
        </p>
        <p>
          Orientaatioviikko järjestetään 24.-28.8.2025, mutta jo ennen sitä sinulla on mahdollisuus tulla tutustumaan meihin, muihin fukseihin ja ISOihin rentoon Varaslähtöön.
          Varaslähtö fuksivuoteen järjestetään lauantaina 15.8.2025. Siitä lisää Telegram-ryhmissä!
        </p>

        <h6>Aura Friman</h6>
        <p>aura.friman (ät) sahkoinsinoorikilta.fi <br />@aurafarmaamassa</p>

        <h6>Antti Salpakari</h6>
        <p>antti.salpakari (ät) sahkoinsinoorikilta.fi <br />@Salpakari</p>
      </div>
      <aside>
        <div>
          <PageLink to={EMAIL_LINK_MAILTO} desc={EMAIL_LINK}>
            Fuksikipparit tavoitat
          </PageLink>
          <PageLink to="https://api.sahkoinsinoorikilta.fi/members/application" desc="ja tule mukaan toimintaamme&nbsp;›">
            Liity jäseneksi tästä
          </PageLink>
          <PageLink to={FUKSI_POINTS_LINK} desc="Katso fuksipisteitä&nbsp;›">
            Fuksipisteohje
          </PageLink>
        </div>
        <div>
          <InfoBox>
            <h6>Killan Fuksiopas</h6>
            <Link to="https://static.sahkoinsinoorikilta.fi/FTMK/Fopas_25_web.pdf" target="_blank">
              <FopasImage
                src="https://static.sahkoinsinoorikilta.fi/FTMK/Fopas_25_kansi.jpg"
              />
            </Link>

            <p>
              Ennen opintojen alkua on hyvä tutustua killan fuksioppaaseen.
              Tämän vuoden fuksiopas päivitetään tänne kesäkuun loppuun mennessä!
            </p>
            <br />
            <h6>Telegram?</h6>
            <p>
              Telegram on pikaviestinpalvelu, jota käytetään Otaniemessä paljon.
              Hieman samanlainen kuin Whatsapp, mutta ominaisuuksiltaan paremmaksi todettu.
              Lisätietoja: <Link to="https://telegram.org/faq" target="_blank">https://telegram.org/faq</Link>.
            </p>
            <p>
              SIK:n fukseilla on oma Telegram-ryhmä, jonne pääset liitymään tästä:
            </p>
            <QRImages
              src="https://static.sahkoinsinoorikilta.fi/FTMK/SIK-Fuksit-2025.jpg"
            />
            <p>tai <Link to={TG_GROUP_CHAT_LINK} target="_blank">tästä</Link></p>
            <p>Liity myös samalla SIK-fuksien tiedotuskanavalle tästä:</p>
            <QRImages
              src="https://static.sahkoinsinoorikilta.fi/FTMK/SIK-Fuksit-tiedotus-2025.jpg"
            />
            <p>tai <Link to={TG_NOTIFICATIONS_LINK} target="_blank">tästä</Link></p>
          </InfoBox>
        </div>
      </aside>
    </TextSection>
    <CTASection
      bgColor="lightBlue"
      link="/kilta/toiminta"
      linkText="Seuraa killan tapahtumia"
    >
      Killassa tapahtuu kaikenlaista!
    </CTASection>

    <TextSection>
      <h3 id="isot">Fuksiryhmät ja ISO-toiminta</h3>
      <div>
        <p>
          SIK:n fuksit nauttivat hurmaavien ISOjen opastuksesta ja hellästä huolenpidosta omissa fuksiryhmissään.
        </p>
        <p>
          ISOt ovat hiukan vanhempia opiskelijoita ja kiltalaisia, joiden tehtävänä on olla tukenasi fuksivuoden ajan.
          Ensimmäisenä päivänä teidät jaetaan noin kymmenen hengen fuksiryhmiin ja jokaiseen ryhmään kuuluu kolmesta viiteen ISOa, joista yksi toimii opintoISOna.
          ISOilta voit kysyä mitä vain opiskeluun ja opiskelijaelämään liittyen. Vaikka he eivät tietäisi vastausta, he luultavimmin osaavat auttaa sinua vastausten löytämisessä.
        </p>
        <p>
          Kuten sanottu, ISOt tukevat sinua koko fuksivuoden ajan, mutta eniten tulet näkemään heitä Orientaatioviikolla,
          jolloin he kulkevat fuksiryhmäsi kanssa ympäri Otaniemeä ja avaavat ovia teekkariuden saloihin.
          He auttavat sinua myös löytämään opintojen aloittamiseen tarvittavat asiat ja tukevat esimerkiksi lukujärjestyksen tekemisessä sekä kirjastokortin, matkakortin ja opiskelijakortin hankkimisessa.
        </p>
        <p>
          ISOt ovat myös kutsuttuna fuksivuotesi ensimmäiseen tapahtumaan, eli Varaslähtöön. Tule tutustumaan heihin jo siellä!
        </p>
      </div>
    </TextSection>
  </>
);

export default FreshmenPageView;