diff --git a/package-lock.json b/package-lock.json index 3f56703..0446eed 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13036,6 +13036,14 @@ "warning": "^4.0.1" } }, + "react-router-hash-link": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/react-router-hash-link/-/react-router-hash-link-1.2.1.tgz", + "integrity": "sha512-ddkCtmk/JwMmuU087TGShQHYyNjsJ+/9CTyuVdvvKf6ACgqk2Ma9ndX2xogo7WWmyq9AjuziBm5bmJ12zBxtsQ==", + "requires": { + "prop-types": "^15.6.0" + } + }, "react-side-effect": { "version": "1.1.5", "resolved": "https://registry.npmjs.org/react-side-effect/-/react-side-effect-1.1.5.tgz", diff --git a/package.json b/package.json index 8e17464..6e6376c 100644 --- a/package.json +++ b/package.json @@ -112,6 +112,7 @@ "react-jsonschema-form": "^1.5.0", "react-router": "^4.3.1", "react-router-dom": "^4.3.1", + "react-router-hash-link": "^1.2.1", "shortid": "^2.2.14" }, "postcss": {} diff --git a/src/components/AdminHeader/AdminHeader.tsx b/src/components/AdminHeader/AdminHeader.tsx index e1ccb47..92df2c2 100644 --- a/src/components/AdminHeader/AdminHeader.tsx +++ b/src/components/AdminHeader/AdminHeader.tsx @@ -5,8 +5,8 @@ import { Link } from "react-router-dom"; import * as TitleImage from "../../assets/img/SIK_RGB_W_side.png"; import "./AdminHeader.scss"; -export interface AdminHeaderProps {} -export interface AdminHeaderState {} +export interface AdminHeaderProps { } +export interface AdminHeaderState { } class AdminHeader extends React.Component { render() { diff --git a/src/components/AdminSidebarLink/AdminSidebarLink.tsx b/src/components/AdminSidebarLink/AdminSidebarLink.tsx index 61387fd..cc64fe0 100644 --- a/src/components/AdminSidebarLink/AdminSidebarLink.tsx +++ b/src/components/AdminSidebarLink/AdminSidebarLink.tsx @@ -1,5 +1,5 @@ import * as React from "react"; -import { Link } from "react-router-dom"; +import Anchor from "../Anchor"; import "./AdminSidebarLink.scss"; export interface AdminSidebarLinkProps { @@ -7,7 +7,7 @@ export interface AdminSidebarLinkProps { path: string; id?: string; } -export interface AdminSidebarLinkState {} +export interface AdminSidebarLinkState { } class AdminSidebarLink extends React.Component { render() { @@ -15,9 +15,9 @@ class AdminSidebarLink extends React.Component - { children } - + + {children} + ); } } diff --git a/src/components/Anchor/Anchor.tsx b/src/components/Anchor/Anchor.tsx new file mode 100644 index 0000000..0eea2b0 --- /dev/null +++ b/src/components/Anchor/Anchor.tsx @@ -0,0 +1,29 @@ +import * as React from "react"; +import { Link } from "react-router-dom"; +import { HashLink } from "react-router-hash-link"; + +export interface AnchorProps extends React.HTMLAttributes { + to: string; +} + +class Anchor extends React.Component { + render() { + const { children, to, ...props } = this.props; + + if (to.startsWith("/")) { + return ( + {children} + ); + } else if (to.startsWith("#")) { + return ( + {children} + ); + } + else { + return ( + {children} + ); + } + } +} +export default Anchor; diff --git a/src/components/Anchor/index.ts b/src/components/Anchor/index.ts new file mode 100644 index 0000000..dcc717e --- /dev/null +++ b/src/components/Anchor/index.ts @@ -0,0 +1,2 @@ +import Anchor from "./Anchor"; +export default Anchor; diff --git a/src/components/Card/Card.tsx b/src/components/Card/Card.tsx index 5e9db78..68b8d74 100644 --- a/src/components/Card/Card.tsx +++ b/src/components/Card/Card.tsx @@ -1,7 +1,7 @@ import * as React from "react"; -import { Link } from "react-router-dom"; import Button, { ButtonType } from "../Button/Button"; import "./Card.scss"; +import Anchor from "../Anchor"; export interface CardProps { title: string; @@ -11,7 +11,7 @@ export interface CardProps { image?: string; button?: JSX.Element; } -export interface CardState {} +export interface CardState { } class Card extends React.Component { render() { @@ -30,13 +30,13 @@ class Card extends React.Component { ) : null; if (link) { return ( - + {imageElem}
{datetime}
{title}
{text}
{button}
- + ); } else { return ( diff --git a/src/components/Footer/Footer.tsx b/src/components/Footer/Footer.tsx index 503cb80..4968e0d 100644 --- a/src/components/Footer/Footer.tsx +++ b/src/components/Footer/Footer.tsx @@ -1,6 +1,6 @@ import * as React from "react"; -import { Link } from "react-router-dom"; -import FooterMap from "../FooterMap/FooterMap"; +import FooterMap from "../FooterMap"; +import Anchor from "../Anchor"; import "./Footer.scss"; export interface FooterProps { } @@ -23,13 +23,13 @@ class Footer extends React.Component {

Y-tunnus: 1627010-1

sik-hallitus@list.ayy.fi

- Yhteystiedot + Yhteystiedot
- Jäseneksi - Palaute - Arkisto - Materiaalipankki + Jäseneksi + Palaute + Arkisto + Materiaalipankki
diff --git a/src/components/HeroAsideItem/HeroAsideItem.tsx b/src/components/HeroAsideItem/HeroAsideItem.tsx index a8539ac..a3d2f8a 100644 --- a/src/components/HeroAsideItem/HeroAsideItem.tsx +++ b/src/components/HeroAsideItem/HeroAsideItem.tsx @@ -1,27 +1,27 @@ import * as React from "react"; -import { Link } from "react-router-dom"; import "./HeroAsideItem.scss"; +import Anchor from "../Anchor"; export interface HeroAsideItemProps { title: string; linkText: string; linkHref: string; } -export interface HeroAsideItemState {} +export interface HeroAsideItemState { } class HeroAsideItem extends React.Component< HeroAsideItemProps, HeroAsideItemState -> { + > { render() { const { title, linkText, linkHref, children } = this.props; return (

{title}

{children}

- +
{linkText} ›
- +
); } diff --git a/src/components/NavbarChildLink/NavbarChildLink.tsx b/src/components/NavbarChildLink/NavbarChildLink.tsx index 5ad3c08..96eb546 100644 --- a/src/components/NavbarChildLink/NavbarChildLink.tsx +++ b/src/components/NavbarChildLink/NavbarChildLink.tsx @@ -1,6 +1,6 @@ import * as React from "react"; -import { Link } from "react-router-dom"; import "./NavbarChildLink.scss"; +import Anchor from "../Anchor"; export interface NavbarChildLinkProps { to: string; @@ -12,10 +12,10 @@ export interface NavbarChildLinkState { class NavbarChildLink extends React.Component { render() { return ( - {this.props.children} - + ); } } diff --git a/src/components/NavbarDropdownLink/NavbarDropdownLink.tsx b/src/components/NavbarDropdownLink/NavbarDropdownLink.tsx index 08bc619..d6dbb80 100644 --- a/src/components/NavbarDropdownLink/NavbarDropdownLink.tsx +++ b/src/components/NavbarDropdownLink/NavbarDropdownLink.tsx @@ -1,8 +1,8 @@ import * as React from "react"; -import { Link } from "react-router-dom"; import "./NavbarDropdownLink.scss"; import { Fragment } from "react"; import DropDownBox from "../DropDownBox/DropDownBox"; +import Anchor from "../Anchor"; export interface NavbarDropdownLinkProps { to: string; @@ -56,9 +56,9 @@ class NavbarDropdownLink extends React.Component - {text} + >{text} {children} ); @@ -66,11 +66,11 @@ class NavbarDropdownLink extends React.Component - {text} + >{text} {

Yhteistyössä

- - - - - + + + + +
Haluatko kuulla lisää yhteistyöstä kanssamme?
diff --git a/src/components/TextAnchor/TextAnchor.tsx b/src/components/TextAnchor/TextAnchor.tsx index 23bf596..cf4cb4a 100644 --- a/src/components/TextAnchor/TextAnchor.tsx +++ b/src/components/TextAnchor/TextAnchor.tsx @@ -1,7 +1,7 @@ import * as React from "react"; import "./TextAnchor.scss"; -import { Link } from "react-router-dom"; import { ColorEnum, getColor, getHoverColor } from "../ColorDiv/ColorDiv"; +import Anchor from "../Anchor"; export enum TextSize { @@ -23,7 +23,6 @@ const sizes = new Map([ export interface TextAnchorProps { size?: TextSize; to: string; - style?: any; textColor?: ColorEnum; hoverColor?: ColorEnum; } @@ -31,24 +30,16 @@ export interface TextAnchorState { } class TextAnchor extends React.Component { render() { - const { children, size, to, style, textColor, hoverColor } = this.props; + const { children, size, to, textColor, hoverColor } = this.props; const classColor = textColor !== undefined ? getColor(textColor) : getColor(ColorEnum.DarkBlue); const classHoverColor = hoverColor !== undefined ? getHoverColor(hoverColor) : getHoverColor(ColorEnum.Blue); const classSize = size !== undefined ? sizes.get(size) : sizes.get(TextSize.Normal); const className = `text-anchor ${classSize} ${classColor} ${classHoverColor}`; - if (to.startsWith("/")) { - return ( - - {children} - - ); - } else { - return ( - - {children} - - ); - } + return ( + + {children} + + ); } } diff --git a/src/pages/AdminEventPage/AdminEventPage.tsx b/src/pages/AdminEventPage/AdminEventPage.tsx index df77c26..966cfc9 100644 --- a/src/pages/AdminEventPage/AdminEventPage.tsx +++ b/src/pages/AdminEventPage/AdminEventPage.tsx @@ -1,6 +1,6 @@ import * as React from "react"; import Helmet from "react-helmet"; -import { Link } from "react-router-dom"; +import Anchor from "../../components/Anchor"; import { formatRelative } from "date-fns"; import "./AdminEventPage.scss"; @@ -64,16 +64,16 @@ class AdminEventPage extends React.Component ( - + Create event - + ) renderData = () => { const { events, error } = this.state; if (error) { - return
{ error }
; + return
{error}
; } if (!events || events.length === 0) { @@ -92,7 +92,7 @@ class AdminEventPage extends React.Component {events.map(event => ( - {event.title} + {event.title} {formatRelative(new Date(event.start_time), new Date())} {formatRelative(new Date(event.end_time), new Date())} @@ -109,8 +109,8 @@ class AdminEventPage extends React.Component

Events

- { this.renderAddLink() } - { this.renderData() } + {this.renderAddLink()} + {this.renderData()} ); } diff --git a/src/pages/AdminFeedPage/AdminFeedPage.tsx b/src/pages/AdminFeedPage/AdminFeedPage.tsx index 58ac79d..34d4135 100644 --- a/src/pages/AdminFeedPage/AdminFeedPage.tsx +++ b/src/pages/AdminFeedPage/AdminFeedPage.tsx @@ -1,9 +1,9 @@ import * as React from "react"; import Helmet from "react-helmet"; -import { Link } from "react-router-dom"; +import Anchor from "../../components/Anchor"; import "./AdminFeedPage.scss"; import { StaticContext } from "../../server/StaticContext"; -import { Post, getFeed} from "../../models/Feed"; +import { Post, getFeed } from "../../models/Feed"; import { getEvents } from "../../models/Event"; import { formatRelative } from "date-fns"; import { th } from "date-fns/esm/locale"; @@ -64,9 +64,9 @@ class AdminFeedPage extends React.Component ( - + Create post - + ) renderData = () => { @@ -92,7 +92,7 @@ class AdminFeedPage extends React.Component {feed.map(post => ( - {post.title} + {post.title} {post.description} {formatRelative(new Date(post.publish_time), new Date())} @@ -110,8 +110,8 @@ class AdminFeedPage extends React.Component

Feed

- { this.renderAddLink() } - { this.renderData() } + {this.renderAddLink()} + {this.renderData()} ); } diff --git a/src/pages/AdminFrontPage/AdminFrontPage.tsx b/src/pages/AdminFrontPage/AdminFrontPage.tsx index e0e9253..606629a 100644 --- a/src/pages/AdminFrontPage/AdminFrontPage.tsx +++ b/src/pages/AdminFrontPage/AdminFrontPage.tsx @@ -1,10 +1,10 @@ import * as React from "react"; import Helmet from "react-helmet"; -import { Link } from "react-router-dom"; +import Anchor from "../../components/Anchor"; import "./AdminFrontPage.scss"; -export interface AdminFrontPageProps {} -export interface AdminFrontPageState {} +export interface AdminFrontPageProps { } +export interface AdminFrontPageState { } class AdminFrontPage extends React.Component { render() { @@ -14,8 +14,8 @@ class AdminFrontPage extends React.Component

SIK Admin

- Events - Feed + Events + Feed ); } diff --git a/src/pages/AdminSignupPage/AdminSignupPage.tsx b/src/pages/AdminSignupPage/AdminSignupPage.tsx index 35f1c28..ee59e1d 100644 --- a/src/pages/AdminSignupPage/AdminSignupPage.tsx +++ b/src/pages/AdminSignupPage/AdminSignupPage.tsx @@ -1,7 +1,7 @@ import * as React from "react"; import Helmet from "react-helmet"; -import { Link } from "react-router-dom"; import { formatRelative } from "date-fns"; +import Anchor from "../../components/Anchor"; import "./AdminSignupPage.scss"; import { SignupForm, getForms } from "../../models/SignupForm"; @@ -9,7 +9,6 @@ import { StaticContext } from "../../server/StaticContext"; // @ts-ignore import * as AddIcon from "../../assets/img/add-icon.png"; - export interface AdminSignupPageProps { staticContext: StaticContext; } @@ -64,16 +63,16 @@ class AdminSignupPage extends React.Component ( - + Create signup form - + ) renderData = () => { const { signupForms, error } = this.state; if (error) { - return
{ error }
; + return
{error}
; } if (!signupForms || signupForms.length === 0) { @@ -92,7 +91,7 @@ class AdminSignupPage extends React.Component {signupForms.map(signupForm => ( - {signupForm.title} + {signupForm.title} {formatRelative(new Date(signupForm.start_time), new Date())} {formatRelative(new Date(signupForm.end_time), new Date())} @@ -109,8 +108,8 @@ class AdminSignupPage extends React.Component

Sign-up forms

- { this.renderAddLink() } - { this.renderData() } + {this.renderAddLink()} + {this.renderData()} ); } diff --git a/src/pages/GuildPage/GuildPage.tsx b/src/pages/GuildPage/GuildPage.tsx index 0cee573..ed09f2a 100644 --- a/src/pages/GuildPage/GuildPage.tsx +++ b/src/pages/GuildPage/GuildPage.tsx @@ -35,22 +35,22 @@ class GuildPage extends React.Component { @@ -58,7 +58,7 @@ class GuildPage extends React.Component { -

Killan tehtävät ja tarina

+

Killan tehtävät ja tarina

Kilta tukee jäsentensä hyvinvointia ja tarjoaa vastapainoa opiskelulle. Kilta järjestää esimerkiksi urheilutapahtumia, kulttuurielämyksiä ja näiden lisäksi sitsejä ja saunailtoja. Valinnanvaraa on, joten tapahtumakalenterin aktiivisella seuraamisella saattaa olla hyvinkin miellyttäviä seuraamuksia. Voit myös itse järjestää mieleisesi tapahtuman killan tukemana, tai ehdottaa sitä killan toimitsijoille.

Yhteistyössä korkeakoulun kanssa, kilta kehittää opetusta. Kilta on mukana kurssien kehittämisessä, valvoo kiltalaisten etua korkeakoulussa ja tuo korkeakoulun henkilöstöä lähemmäs kiltalaisia. Kilta avaa oven yritysmaailmaan järjestämällä yritysten kanssa excursioita, saunailtoja ja yritystapahtumia. Lisäksi killan kautta kuulee ensimmäisten joukossa uusista avoimista työpaikoista. Killalla on Otaniemen mukavin kiltahuone, jossa voi käydä hengähtämässä luentojen välillä, hakea apua vaikeisiin tehtäviin tai järjestää vaikka leffailtoja. Tämän lisäksi killalla on myös haastavampaan elektroniikkaharrasteluun sopivat tilat.

@@ -96,7 +96,7 @@ class GuildPage extends React.Component {
- + Yliopiston jäsenedut @@ -118,7 +118,7 @@ class GuildPage extends React.Component { -

Organisaatio

+

Organisaatio

Sähköinsinöörikillassa toimeenpanovaltaa käyttää 3–13 kiltalaisen muodostama hallitus apunaan lukuisa määrä toimihenkilöitä. Hallituksen ja toimihenkilöt valitsee killan valtuusto, joka myös valvoo näiden toimintaa. Käytännössä valtuusto valitsee vaalikokouksessaan ensin uuden puheenjohtajan ja jää 1–2 viikon mittaiselle kokoustauolle. Tauon jälkeen puheenjohtaja esittelee valtuustolle ehdotuksensa hallitukseksi ja toimihenkilöiksi, ja valtuusto joko hyväksyy tai hylkää ehdotuksen noin tunnin kestävän kysely- ja esittelytuokion jälkeen. Hallituksen kuulumiset lorem.

@@ -213,7 +213,7 @@ class GuildPage extends React.Component { -

Jäsenedut vuonna 2019

+

Jäsenedut vuonna 2019