Compare revisions

Rafael László · Rafael László · Rafael László · Rafael László · Rafael László · Rafael László
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
 variables:
-  CONTAINER_IMAGE: 'registry.kszk.bme.hu/kszk/devteam/$CI_PROJECT_NAME:$CI_COMMIT_REF_NAME'
+  CONTAINER_IMAGE: 'harbor.sch.bme.hu/kszk-kepzes/frontend:$CI_COMMIT_REF_NAME'
 stages:
  - Pre Build
@@ -8,9 +8,11 @@ stages:
 PreBuild:
  stage: Pre Build
-  tags: [kszk]
+  # tags: [kszk]
-  image: node:latest
+  image: node:14.19-alpine3.14
  script:
+    -   'echo -n "Node version: " && node --version \
+      && echo -n "NPM version: " && npm --version'
    - npm install
    - npm run build
  cache:
@@ -25,30 +27,32 @@ PreBuild:
 Docker build:
  stage: Docker Build
-  tags: [kszk]
+  # tags: [kszk]
  only:
    - tags
  image:
    name: gcr.io/kaniko-project/executor:debug
    entrypoint: ['']
  script:
-    - echo "{\"auths\":{\"registry.kszk.bme.hu\":{\"username\":\"$REGISTRY_USER\",\"password\":\"$REGISTRY_PASSWORD\"}}}" > /kaniko/.docker/config.json
+    - echo "{\"auths\":{\"harbor.sch.bme.hu\":{\"username\":\"$REGISTRY_USER\",\"password\":\"$REGISTRY_PASSWORD\"}}}" > /kaniko/.docker/config.json
    - /kaniko/executor --context $CI_PROJECT_DIR --dockerfile $CI_PROJECT_DIR/Dockerfile --destination $CONTAINER_IMAGE
 Deploy to Kubernetes:
  stage: deploy
  image: alpine
-  tags: [devteam]
+  tags: [k9r]
  environment:
    name: master
-  script:
+  before_script:
+    - chmod 600 $KUBECONFIG
    - apk add --no-cache curl
    - curl -LO "https://dl.k8s.io/release/$(curl -L -s https://dl.k8s.io/release/stable.txt)/bin/linux/amd64/kubectl"
    - chmod +x ./kubectl
    - mv ./kubectl /usr/local/bin/kubectl
    - kubectl version
+  script:
    - cd k8s
-    - sed -i "s|##IMAGETAG##|${CI_COMMIT_REF_NAME}|" deployment.yml
+    - sed -i "s|##IMAGETAG##|${CI_COMMIT_REF_NAME}|" deployment.yaml
-    - kubectl apply -f deployment.yml
+    - kubectl apply -f ./
  only:
    - tags
--- a/k8s/deployment.yml
+++ b/k8s/deployment.yml
@@ -3,12 +3,14 @@ apiVersion: apps/v1
 kind: Deployment
 metadata:
  name: kszkepzes-frontend
-  namespace: devteam-kszk-bme-hu
+  namespace: kszk-kepzes-site
 spec:
  replicas: 1
  selector:
    matchLabels:
      app: kszkepzes-frontend
+  strategy:
+    type: Recreate
  template:
    metadata:
      labels:
@@ -16,9 +18,12 @@ spec:
    spec:
      containers:
        - name: kszkepzes-frontend
-          image: registry.kszk.bme.hu/kszk/devteam/kszkepzes-frontend:##IMAGETAG##
+          image: harbor.sch.bme.hu/kszk-kepzes/frontend:##IMAGETAG##
          imagePullPolicy: 'Always'
          ports:
            - containerPort: 3000
+          resources:
+            limits:
+              memory: 200Mi
      imagePullSecrets:
-        - name: kszkepzes-regcred
+        - name: harbor
--- a/k8s/ingress.yaml
+++ b/k8s/ingress.yaml
+apiVersion: networking.k8s.io/v1
+kind: Ingress
+metadata:
+  namespace: kszk-kepzes-site
+  annotations:
+    cert-manager.io/cluster-issuer: letsencrypt
+    kubernetes.io/tls-acme: "true"
+  name: kszkepzes-frontend
+spec:
+  rules:
+    - host: "ujonc.kszk.bme.hu"
+      http:
+        paths:
+          - path: /
+            pathType: Prefix
+            backend:
+              service:
+                name: kszkepzes-frontend
+                port:
+                  number: 3000
+  tls:
+    - hosts:
+        - "ujonc.kszk.bme.hu"
+      secretName: kszkepzes-cert
\ No newline at end of file
--- a/k8s/service.yml
+++ b/k8s/service.yml
@@ -3,7 +3,7 @@ apiVersion: v1
 kind: Service
 metadata:
  name: kszkepzes-frontend
-  namespace: devteam-kszk-bme-hu
+  namespace: kszk-kepzes-site
 spec:
  type: ClusterIP
  ports:

--- a/package-lock.json
+++ b/package-lock.json
--- a/public/index.html
+++ b/public/index.html
@@ -29,7 +29,7 @@
      work correctly both with client-side routing and a non-root public URL.
      Learn how to configure a non-root public URL by running `npm run build`.
    -->
-    <title>KSZKépzés 2021</title>
+    <title>KSZKépzés 2025</title>
  </head>
  <body>
    <noscript> You need to enable JavaScript to run this app. </noscript>

--- a/src/actions/auth.js
+++ b/src/actions/auth.js
@@ -58,6 +58,11 @@ export const getUserData = () => async (dispatch) => {
    });
  } catch (e) {
    console.log(e);
+    // Invalid session bug workaround
+    if (!e.response) {
+      window.location = "/oidc/logout"
+    }
  }
 };
@@ -105,6 +110,7 @@ export const submitRegistration = ({
      alert('Mentés nem sikerült!');
    }
  } catch (e) {
-    console.log(e);
+    console.log(e, e.response);
+    alert('Mentés nem sikerült!');
  }
 };
--- a/src/components/App.js
+++ b/src/components/App.js
@@ -4,7 +4,7 @@ import Main from './Main';
 import React from 'react';
 const App = () => (
-  <div style={{ minHeight: '100%', position: 'relative' }}>
+  <div style={{ minHeight: '100%', position: 'relative', paddingBottom: '3em' }}>
    <header id="header">
      <Header />
    </header>

--- a/src/components/Footer.js
+++ b/src/components/Footer.js
-import { Container, Segment } from 'semantic-ui-react';
+import { Container, Segment } from "semantic-ui-react";
-import React from 'react';
+import React from "react";
 const Footer = () => (
  <Segment inverted vertical textAlign="center">
    <Container>
-      <p textalign="center">Created by DevTeam &copy; 2018-2021.</p>
+      <p textalign="center">Created by DevTeam &copy; 2018-2025.</p>
    </Container>
  </Segment>
 );

--- a/src/components/Header.js
+++ b/src/components/Header.js
@@ -7,64 +7,64 @@ import {
  Popup,
  Responsive,
  Segment,
-} from 'semantic-ui-react';
+} from "semantic-ui-react";
-import React, { Component } from 'react';
+import React, { Component } from "react";
-import KSZKlogo from './images/kszk_logo.svg';
+import KSZKlogo from "./images/kszk_logo.svg";
-import { Link } from 'react-router-dom';
+import { Link } from "react-router-dom";
-import { connect } from 'react-redux';
+import { connect } from "react-redux";
-import { getUserData } from '../actions';
+import { getUserData } from "../actions";
 // Objects that will be converted to menu items in the render method
 const menuItems = [
  {
-    text: 'Főoldal',
+    text: "Főoldal",
-    to: '/home',
+    to: "/home",
    prefix: (
-      <Image size="mini" src={KSZKlogo} style={{ marginRight: '1.5em' }} />
+      <Image size="mini" src={KSZKlogo} style={{ marginRight: "1.5em" }} />
    ),
    permissionLevel: 0,
  },
  {
-    text: 'Hírek',
+    text: "Hírek",
-    to: '/news',
+    to: "/news",
-    prefix: '',
+    prefix: "",
    permissionLevel: 0,
  },
  {
-    text: 'Köreink',
+    text: "Köreink",
-    to: '/groups',
+    to: "/groups",
-    prefix: '',
+    prefix: "",
    permissionLevel: 0,
  },
  {
-    text: 'Ütemterv',
+    text: "Ütemterv",
-    to: '/schedule',
+    to: "/schedule",
-    prefix: '',
+    prefix: "",
    permissionLevel: 1,
  },
  {
-    text: 'Mentorok',
+    text: "Mentorok",
-    to: '/mentors',
+    to: "/mentors",
-    prefix: '',
+    prefix: "",
    permissionLevel: 1,
  },
  {
-    text: 'Statisztika',
+    text: "Statisztika",
-    to: '/statistics',
+    to: "/statistics",
-    prefix: '',
+    prefix: "",
    permissionLevel: 3,
  },
  {
-    text: 'Jelentkezések',
+    text: "Jelentkezések",
-    to: '/applications',
+    to: "/applications",
-    prefix: '',
+    prefix: "",
    permissionLevel: 3,
  },
  {
-    text: 'Házi feladatok',
+    text: "Házi feladatok",
-    to: '/homework',
+    to: "/homework",
-    prefix: '',
+    prefix: "",
    permissionLevel: 2,
  },
 ];
@@ -97,7 +97,7 @@ class Header extends Component {
    let maxNum = 0;
    if (this.props.user.id) {
      maxNum = menuItems.filter(
-        (item) => this.props.user.permission >= item.permissionLevel
+        (item) => this.props.user.permission >= item.permissionLevel,
      ).length;
    } else {
      maxNum = 3;
@@ -161,7 +161,7 @@ class Header extends Component {
                        {item.prefix}
                        {item.text}
                      </Menu.Item>
-                    ) : null
+                    ) : null,
                  )}
                </Menu>
              </Popup>
@@ -173,10 +173,10 @@ class Header extends Component {
                  <Button inverted as={Link} to="/profile">
                    Profilom
                  </Button>
-                  <Button as="a" href="/api/v1/logout/" icon="sign out" />
+                  <Button as="a" href="/oidc/logout/" icon="sign out" />
                </Button.Group>
              ) : (
-                <Button as="a" href="/api/v1/login/authsch/" inverted>
+                <Button as="a" href="/oidc/authenticate/" inverted>
                  Bejelentkezés
                </Button>
              )}
@@ -247,7 +247,7 @@ class Header extends Component {
                          {item.prefix}
                          {item.text}
                        </Menu.Item>
-                      ) : null
+                      ) : null,
                    )}
                    <Menu.Item>
                      {this.props.user.id ? (
@@ -263,7 +263,7 @@ class Header extends Component {
                          <Button
                            onClick={this.handleClose}
                            as="a"
-                            href="/api/v1/logout/"
+                            href="/oidc/logout/"
                            icon="sign out"
                          />
                        </Button.Group>
@@ -271,7 +271,7 @@ class Header extends Component {
                        <Button
                          onClick={this.handleClose}
                          as="a"
-                          href="/api/v1/login/authsch/"
+                          href="/oidc/authenticate/"
                          inverted
                        >
                          Bejelentkezés

--- a/src/components/forms/AddSolutionForm.js
+++ b/src/components/forms/AddSolutionForm.js
@@ -35,6 +35,16 @@ const allowedFileTypes = [
  'application/x-zip',
 ];
+const allowedFileEnds = ['.zip', '.jpeg', '.jpg', '.jpe', '.png'];
+function validateFileName(fileNameToValidate) {
+  return (
+    allowedFileEnds.find((typeName) => {
+      return fileNameToValidate.toLowerCase().endsWith(typeName);
+    }).length > 0
+  );
+}
 // in megabytes
 const maxFileSize = 50;
@@ -211,7 +221,7 @@ class AddSolutionForm extends Component {
                    !description ||
                    (!file
                      ? false
-                      : !allowedFileTypes.includes(file.type) ||
+                      : !validateFileName(file.name) ||
                        file.size > maxFileSize * 1024 ** 2)
                  }
                  inverted
@@ -270,7 +280,7 @@ class AddSolutionForm extends Component {
                !description ||
                (!file
                  ? false
-                  : !allowedFileTypes.includes(file.type) ||
+                  : !validateFileName(file.name) ||
                    file.size > maxFileSize * 1024 ** 2)
              }
              onClick={() => {

--- a/src/components/pages/EventDetail.js
+++ b/src/components/pages/EventDetail.js
@@ -8,24 +8,24 @@ import {
  Item,
  Segment,
  Table,
-} from 'semantic-ui-react';
+} from "semantic-ui-react";
-import React, { Component } from 'react';
+import React, { Component } from "react";
 import {
  clearWrite,
  getNotesByEvent,
  postEventNote,
  writeNote,
-} from '../../actions/notes';
+} from "../../actions/notes";
 import {
  getEventById,
  getTrainees,
  submitVisitors,
  visitorChange,
-} from '../../actions/statistics';
+} from "../../actions/statistics";
-import TraineeTableRow from './EventDetailTableRow';
+import TraineeTableRow from "./EventDetailTableRow";
-import { connect } from 'react-redux';
+import { connect } from "react-redux";
-import moment from 'moment';
+import moment from "moment";
 class EventDetail extends Component {
  constructor(props) {
@@ -43,20 +43,30 @@ class EventDetail extends Component {
  renderTrainees() {
    const event = this.props.selectedEvent;
-    return this.props.trainees?.map((item) => {
+    return this.props.trainees
-      const notes = this.props.eventNotes?.filter(
+      ?.sort(function (a, b) {
-        (note) => note.profile === item.id
+        var nameA = a.full_name.toLowerCase(),
-      );
+          nameB = b.full_name.toLowerCase();
-      return item.role === 'Student' ? (
+        if (nameA < nameB)
-        <TraineeTableRow
+          //sort string ascending
-          selectedEvent={event}
+          return -1;
-          notes={notes}
+        if (nameA > nameB) return 1;
-          trainee={item}
+        return 0; //default return value (no sorting)
-          edit={this.state.edit}
+      })
-          key={item.id}
+      .map((item) => {
-        />
+        const notes = this.props.eventNotes?.filter(
-      ) : null;
+          (note) => note.profile === item.id
-    });
+        );
+        return item.role === "Student" ? (
+          <TraineeTableRow
+            selectedEvent={event}
+            notes={notes}
+            trainee={item}
+            edit={this.state.edit}
+            key={item.id}
+          />
+        ) : null;
+      });
  }
  renderEvent() {
@@ -64,11 +74,11 @@ class EventDetail extends Component {
    return (
      <Segment>
        <Item>
-          <Divider style={{ fontSize: '2em' }} horizontal>
+          <Divider style={{ fontSize: "2em" }} horizontal>
            <Header as="h1">
              {name}
-              <Item.Header style={{ fontSize: '0.6em' }}>
+              <Item.Header style={{ fontSize: "0.6em" }}>
-                {moment(date).format('LL')}
+                {moment(date).format("LL")}
              </Item.Header>
            </Header>
          </Divider>
@@ -91,7 +101,7 @@ class EventDetail extends Component {
              <Comment.Content>
                <Comment.Author>{note.created_by_name}</Comment.Author>
                <Comment.Metadata>
-                  {moment(note.created_at).format('LL')}
+                  {moment(note.created_at).format("LL")}
                </Comment.Metadata>
                <Comment.Text>{note.note}</Comment.Text>
              </Comment.Content>
@@ -99,7 +109,7 @@ class EventDetail extends Component {
          </Segment>
        );
      }
-      return '';
+      return "";
    });
  }
@@ -107,24 +117,12 @@ class EventDetail extends Component {
    const event = this.props.selectedEvent;
    const note = this.props.actualNote;
    return (
-      <Container style={{ paddingTop: '1em', paddingBottom: '7em' }}>
+      <Container style={{ paddingTop: "1em", paddingBottom: "7em" }}>
        <Container textAlign="center">
          {this.props.selectedEvent && this.props.trainees
            ? this.renderEvent()
-            : ''}
+            : ""}
        </Container>
-        <Table celled unstackable>
-          <Table.Header>
-            <Table.Row textAlign="center">
-              <Table.HeaderCell>Név</Table.HeaderCell>
-              <Table.HeaderCell>Jelen volt</Table.HeaderCell>
-              <Table.HeaderCell>Megjegyzések</Table.HeaderCell>
-            </Table.Row>
-          </Table.Header>
-          <Table.Body>
-            {this.props.selectedEvent ? this.renderTrainees() : null}
-          </Table.Body>
-        </Table>
        {!this.state.edit ? (
          <Button onClick={() => this.setState({ edit: true })}>
            Módosítás
@@ -133,16 +131,27 @@ class EventDetail extends Component {
          <Button
            onClick={() => {
              this.setState({ edit: false });
-              this.props.submitVisitors(this.props.selectedEvent);
            }}
          >
-            {' '}
+            {" "}
            Kész
          </Button>
        )}
+        <Table celled unstackable>
+          <Table.Header>
+            <Table.Row textAlign="center">
+              <Table.HeaderCell>Név</Table.HeaderCell>
+              <Table.HeaderCell>Jelen volt</Table.HeaderCell>
+              <Table.HeaderCell>Megjegyzések</Table.HeaderCell>
+            </Table.Row>
+          </Table.Header>
+          <Table.Body>
+            {this.props.selectedEvent ? this.renderTrainees() : null}
+          </Table.Body>
+        </Table>
        <Comment.Group>
          <Header dividing>Megjegyzések</Header>
-          {this.props.eventNotes ? this.renderComments() : ''}
+          {this.props.eventNotes ? this.renderComments() : ""}
          <Form reply>
            <Form.TextArea
              value={note.note}

--- a/src/components/pages/Home.js
+++ b/src/components/pages/Home.js
-import './Home.css';
+import "./Home.css";
 import {
  Button,
@@ -9,15 +9,15 @@ import {
  Image,
  Responsive,
  Segment,
-} from 'semantic-ui-react';
+} from "semantic-ui-react";
 /* eslint-disable react/jsx-props-no-spreading */
-import React, { Component } from 'react';
+import React, { Component } from "react";
-import KSZKbiglogo from '../images/kszk_with_shadow.png';
+import KSZKbiglogo from "../images/kszk_with_shadow.png";
-import { Link } from 'react-router-dom';
+import { Link } from "react-router-dom";
-import Slider from 'react-slick';
+import Slider from "react-slick";
-import { connect } from 'react-redux';
+import { connect } from "react-redux";
-import { getImages } from '../../actions/home';
+import { getImages } from "../../actions/home";
 const settings = {
  dots: false,
@@ -58,8 +58,8 @@ class Home extends Component {
                content="Üdvözlünk a"
                inverted
                style={{
-                  fontSize: '3vw',
+                  fontSize: "3vw",
-                  fontWeight: 'normal',
+                  fontWeight: "normal",
                  marginBottom: 0,
                }}
              />
@@ -68,10 +68,10 @@ class Home extends Component {
                content="Kollégiumi Számítástechnikai Kör"
                inverted
                style={{
-                  fontSize: '3.5vw',
+                  fontSize: "3.5vw",
-                  fontWeight: 'bold',
+                  fontWeight: "bold",
-                  marginBottom: '0.5vw',
+                  marginBottom: "0.5vw",
-                  marginTop: '0.5vw',
+                  marginTop: "0.5vw",
                }}
              />
              <Header
@@ -79,57 +79,57 @@ class Home extends Component {
                content="újoncképzésének weboldalán!"
                inverted
                style={{
-                  fontSize: '3vw',
+                  fontSize: "3vw",
-                  fontWeight: 'normal',
+                  fontWeight: "normal",
                  marginBottom: 0,
-                  marginTop: '0.5vw',
+                  marginTop: "0.5vw",
                }}
              />
              <Image
                verticalAlign="middle"
                src={KSZKbiglogo}
-                style={{ marginTop: '1vw', width: '17%' }}
+                style={{ marginTop: "1vw", width: "17%" }}
              />
              <Header
                as="h1"
                content="Szeretettel várunk a KSZKépzésre!"
                inverted
                style={{
-                  fontSize: '3vw',
+                  fontSize: "3vw",
-                  fontWeight: 'normal',
+                  fontWeight: "normal",
                  marginBottom: 0,
-                  marginTop: '1vw',
+                  marginTop: "1vw",
                }}
              />
              <Container>
                {this.props.user.id ? (
-                  <Button
+                <Button
-                    as={Link}
+                as={Link}
-                    to="/profile"
+                to="/profile"
-                    primary
+                primary
-                    size="huge"
+                size="huge"
-                    style={{
+                style={{
-                      fontSize: '2vw',
+                fontSize: "2vw",
-                      marginTop: '1vw',
+                marginTop: "1vw",
-                      marginBottom: '1vw',
+                marginBottom: "1vw",
-                      fontWeight: 'bold',
+                fontWeight: "bold",
-                      letterSpacing: '0.13vw',
+                letterSpacing: "0.13vw",
-                    }}
+                }}
-                  >
+                >
                    Jelentkezés
-                    <Icon name="right arrow" />
+                <Icon name="right arrow" />
-                  </Button>
+                </Button>
                ) : (
                  <Button
-                    href="/api/v1/login/authsch/"
+                    href="/oidc/authenticate/"
                    primary
                    size="huge"
                    style={{
-                      fontSize: '2vw',
+                      fontSize: "2vw",
-                      marginTop: '1vw',
+                      marginTop: "1vw",
-                      marginBottom: '1vw',
+                      marginBottom: "1vw",
-                      fontWeight: 'bold',
+                      fontWeight: "bold",
-                      letterSpacing: '0.13vw',
+                      letterSpacing: "0.13vw",
                    }}
                  >
                    Bejelentkezés
@@ -159,8 +159,8 @@ class Home extends Component {
                content="Üdvözlünk a"
                inverted
                style={{
-                  fontSize: '5vw',
+                  fontSize: "5vw",
-                  fontWeight: 'bold',
+                  fontWeight: "bold",
                  marginBottom: 0,
                }}
              />
@@ -169,10 +169,10 @@ class Home extends Component {
                content="Kollégiumi Számítástechnikai Kör"
                inverted
                style={{
-                  fontSize: '6vw',
+                  fontSize: "6vw",
-                  fontWeight: 'bold',
+                  fontWeight: "bold",
-                  marginBottom: '0.5vw',
+                  marginBottom: "0.5vw",
-                  marginTop: '0.5vw',
+                  marginTop: "0.5vw",
                }}
              />
              <Header
@@ -180,27 +180,27 @@ class Home extends Component {
                content="újoncképzésének weboldalán!"
                inverted
                style={{
-                  fontSize: '5vw',
+                  fontSize: "5vw",
-                  fontWeight: 'bold',
+                  fontWeight: "bold",
                  marginBottom: 0,
-                  marginTop: '0.5vw',
+                  marginTop: "0.5vw",
                }}
              />
              <Image
                className="kszklogo"
                verticalAlign="middle"
                src={KSZKbiglogo}
-                style={{ marginTop: '1vw', width: '20%' }}
+                style={{ marginTop: "1vw", width: "20%" }}
              />
              <Header
                as="h1"
                content="Szeretettel várunk a KSZKépzésre!"
                inverted
                style={{
-                  fontSize: '5vw',
+                  fontSize: "5vw",
-                  fontWeight: 'bold',
+                  fontWeight: "bold",
                  marginBottom: 0,
-                  marginTop: '1vw',
+                  marginTop: "1vw",
                }}
              />
              <Container>
@@ -211,11 +211,11 @@ class Home extends Component {
                    primary
                    size="massive"
                    style={{
-                      fontSize: '4vw',
+                      fontSize: "4vw",
-                      marginTop: '1.5vw',
+                      marginTop: "1.5vw",
-                      marginBottom: '1vw',
+                      marginBottom: "1vw",
-                      fontWeight: 'bold',
+                      fontWeight: "bold",
-                      letterSpacing: '0.15vw',
+                      letterSpacing: "0.15vw",
                    }}
                  >
                    Jelentkezés
@@ -223,15 +223,15 @@ class Home extends Component {
                  </Button>
                ) : (
                  <Button
-                    href="/api/v1/login/authsch/"
+                    href="/oidc/authenticate/"
                    primary
                    size="massive"
                    style={{
-                      fontSize: '4vw',
+                      fontSize: "4vw",
-                      marginTop: '1vw',
+                      marginTop: "1vw",
-                      marginBottom: '1vw',
+                      marginBottom: "1vw",
-                      fontWeight: 'bold',
+                      fontWeight: "bold",
-                      letterSpacing: '0.15vw',
+                      letterSpacing: "0.15vw",
                    }}
                  >
                    Bejelentkezés
@@ -250,12 +250,29 @@ class Home extends Component {
  renderText() {
    const kszk_age = new Date().getFullYear() - 1976;
    return (
-      <Segment style={{ padding: '8em 0em', fontFamily: 'Arial' }} vertical>
+      <Segment style={{ padding: "1em 0em", fontFamily: "Arial" }} vertical>
        <Container text>
-          <Header as="h3" style={{ fontSize: '2em', fontFamily: 'Arial' }}>
+          <Segment inverted color="green" tertiary>
+            <Header as="h3" style={{ fontSize: "2em", fontFamily: "Arial" }}>
+              Bemutatkozó videók
+            </Header>
+            <p style={{ fontSize: "1.33em", fontFamily: "Arial" }}>
+              A gólyakörtére készített videóinkat megnézhetitek a{" "}
+              <a
+                href="https://www.youtube.com/@kollegiumiszamitastechnika470/videos"
+                target="_blank"
+                rel="noopener noreferrer"
+                style={{ color: "white", textDecoration: "underline" }}
+              >
+                YouTube csatornánkon
+              </a>
+              !
+            </p>
+          </Segment>
+          <Header as="h3" style={{ fontSize: "2em", fontFamily: "Arial" }}>
            Kik is vagyunk mi?
          </Header>
-          <p style={{ fontSize: '1.33em', fontFamily: 'Arial' }}>
+          <p style={{ fontSize: "1.33em", fontFamily: "Arial" }}>
            A Kollégiumi Számítástechnikai Kör az Egyetem legrégebben működő és
            legnagyobb aktív, informatikával foglalkozó öntevékeny
            csoportosulása, idén ünnepeljük {kszk_age}. születésnapunkat. A
@@ -267,11 +284,11 @@ class Home extends Component {
          <Button as={Link} size="large" to="/groups">
            Ismerd meg a köreinket! <Icon name="right arrow" />
          </Button>
-          <Divider as="h4" className="header" style={{ margin: '3em 0em' }} />
+          <Divider as="h4" className="header" style={{ margin: "3em 0em" }} />
-          <Header as="h3" style={{ fontSize: '2em', fontFamily: 'Arial' }}>
+          <Header as="h3" style={{ fontSize: "2em", fontFamily: "Arial" }}>
            Lehetőségek
          </Header>
-          <p style={{ fontSize: '1.33em', fontFamily: 'Arial' }}>
+          <p style={{ fontSize: "1.33em", fontFamily: "Arial" }}>
            A KSZK a lehetőségek tárháza, a hely ahol Te – leendő mérnök –
            minden területen kipróbálhatod, továbbképezheted magad. Nálunk
            kibontakoztathatod kreativitásod, tapasztalatot, mérnöki szemléletet
@@ -281,13 +298,13 @@ class Home extends Component {
            szakma egy-egy meghatározó területével foglalkoznak a fejlesztés és
            üzemeltetés területén.
          </p>
-          <Divider as="h4" className="header" style={{ margin: '3em 0em' }} />
+          <Divider as="h4" className="header" style={{ margin: "3em 0em" }} />
-          <Header as="h3" style={{ fontSize: '2em', fontFamily: 'Arial' }}>
+          <Header as="h3" style={{ fontSize: "2em", fontFamily: "Arial" }}>
            Miért jó KSZK-snak lenni?
          </Header>
          <div
            class="quote--container"
-            style={{ fontSize: '1.5em', fontFamily: 'Arial' }}
+            style={{ fontSize: "1.5em", fontFamily: "Arial" }}
          >
            <p class="quote">
              Szerintem KSZK-snak jó lenni, mert rengeteget tanulok belőle.
@@ -303,7 +320,7 @@ class Home extends Component {
          </div>
          <div
            class="quote--container"
-            style={{ fontSize: '1.5em', fontFamily: 'Arial' }}
+            style={{ fontSize: "1.5em", fontFamily: "Arial" }}
          >
            <p class="quote">
              A nulláról kezdtem a képzést és az egyetemi tanulmányaimat is,
@@ -315,7 +332,7 @@ class Home extends Component {
          </div>
          <div
            class="quote--container"
-            style={{ fontSize: '1.5em', fontFamily: 'Arial' }}
+            style={{ fontSize: "1.5em", fontFamily: "Arial" }}
          >
            <p class="quote">
              Amikor idejöttem egyetemre nem tudtam, hogy mennyire fogom
@@ -331,7 +348,7 @@ class Home extends Component {
          </div>
          <div
            class="quote--container"
-            style={{ fontSize: '1.5em', fontFamily: 'Arial' }}
+            style={{ fontSize: "1.5em", fontFamily: "Arial" }}
          >
            <p class="quote">
              Számtalan dologgal foglalkozunk, és tényleg azt csinálhatom, ami
@@ -341,33 +358,32 @@ class Home extends Component {
            </p>
            <p class="quote--author">&ndash; Blint</p>
          </div>
-          <Divider as="h4" className="header" style={{ margin: '3em 0em' }} />
+          <Divider as="h4" className="header" style={{ margin: "3em 0em" }} />
-          <Header as="h3" style={{ fontSize: '2em', fontFamily: 'Arial' }}>
+          <Header as="h3" style={{ fontSize: "2em", fontFamily: "Arial" }}>
            Képzésünk
          </Header>
-          <p style={{ fontSize: '1.33em', fontFamily: 'Arial' }}>
+          <p style={{ fontSize: "1.33em", fontFamily: "Arial" }}>
-            Nyolc alkalmas képzésünk végén Te is igazi KSZK-ssá válhatsz, hiszen
+            Képzésünk végén Te is igazi KSZK-ssá válhatsz, hiszen rengeteg
-            rengeteg szakmai tudást igyekszünk átadni nektek. A képzésalkalmak
+            szakmai tudást igyekszünk átadni nektek. A képzésalkalmak rendkívül
-            rendkívül jó hangulatban telnek, és a szociális irányultságú
+            jó hangulatban telnek, és a szociális irányultságú foglalkozások
-            foglalkozások alatt egy nagyon jó csapat kovácsolódik az
+            alatt egy nagyon jó csapat kovácsolódik az érdeklődőkből. Az első
-            érdeklődőkből. Az első képzés időpontja február 28. vasárnap 20:00,
+            képzés időpontja február 20. csütörtök 18:00, ettől kezdve pedig
-            ettől kezdve pedig minden héten találkozunk ugyanabban az
+            minden héten egy közösségi és számos szakmai alkalom során
-            időpontban. Várhatóan a képzés ideje alatt május elején rendezünk
+            találkozunk. A képzésalkalmak után április 11-től 13-ig rendezünk
-            tábort. Az alkalmakon és a táboron kötelező a részvétel.
+            tábort. Az közösségi alkalmakon és a táboron kötelező a részvétel.
          </p>
-          <Divider as="h4" className="header" style={{ margin: '3em 0em' }} />
+          <Divider as="h4" className="header" style={{ margin: "3em 0em" }} />
          <Segment inverted color="red" tertiary>
-            <Header as="h3" style={{ fontSize: '2em', fontFamily: 'Arial' }}>
+            <Header as="h3" style={{ fontSize: "2em", fontFamily: "Arial" }}>
              Korlátos férőhely
            </Header>
-            <p style={{ fontSize: '1.33em', fontFamily: 'Arial' }}>
+            <p style={{ fontSize: "1.33em", fontFamily: "Arial" }}>
              Általánosságban elmondható, hogy a KSZK tagjai rengeteg dologgal
              foglalkoznak a hétköznapjaik során, hogy minden informatikai
              rendszer úgy működjön a kollégiumban, ahogy kell. Így van ez
-              velünk képzőkkel is, emiatt hetente csak egy képzésalkalmat
+              velünk képzőkkel is, emiatt a férőhelyek korlátosak.
-              tartunk majd és maximum 45 embert tudunk befogadni.
            </p>
-            <p style={{ fontSize: '1.33em', fontFamily: 'Arial' }}>
+            <p style={{ fontSize: "1.33em", fontFamily: "Arial" }}>
              Sajnos előfordulhat olyan eset, hogy valaki már nem fér be a
              képzésre, ezért kérünk titeket, hogy ennek tudatában
              jelentkezzetek majd. Ilyen esetben reméljük ez nem szegi
@@ -385,12 +401,12 @@ class Home extends Component {
        <Responsive minWidth={600}>
          <div className="car-image-kszk">
            <div />
-            {this.renderSlider(0, '120%')}
+            {this.renderSlider(0, "120%")}
          </div>
          {this.renderText()}
        </Responsive>
        <Responsive maxWidth={600}>
-          <div className="car-image-kszk">{this.renderSlider(1, '200%')}</div>
+          <div className="car-image-kszk">{this.renderSlider(1, "200%")}</div>
          {this.renderText()}
        </Responsive>
      </div>

--- a/src/components/pages/LeaderBoard.js
+++ b/src/components/pages/LeaderBoard.js
@@ -14,9 +14,8 @@ class LeaderBoard extends Component {
    return this.props.trainees
      .sort(
        (a, b) =>
-          Number(b.homework_bits) +
+          (Number(b.homework_bits) + Number(b.events_visited) + Number(b.extra_bits)) -
-          b.events_visited -
+          (Number(a.homework_bits) + Number(a.events_visited) + Number(a.extra_bits))
-          (Number(a.homework_bits) + a.events_visited)
      )
      .map((trainee) =>
        trainee.role === 'Student' ? (
@@ -24,10 +23,10 @@ class LeaderBoard extends Component {
            <Table.Cell textAlign="center">{trainee.full_name}</Table.Cell>
            <Table.Cell textAlign="center">{trainee.events_visited}</Table.Cell>
            <Table.Cell textAlign="center">
-              {Number(trainee.homework_bits)}
+              {Number(trainee.homework_bits) + Number(trainee.extra_bits)}
            </Table.Cell>
            <Table.Cell textAlign="center">
-              {Number(trainee.homework_bits) + trainee.events_visited}
+              {Number(trainee.homework_bits) + trainee.events_visited + Number(trainee.extra_bits)}
            </Table.Cell>
          </Table.Row>
        ) : null

--- a/src/components/pages/News.js
+++ b/src/components/pages/News.js
@@ -10,6 +10,19 @@ import EditNewsForm from '../forms/EditNewsForm';
 import { connect } from 'react-redux';
 import moment from 'moment';
+const linkify = (text) => {
+  const urlRegex = /(https?:\/\/[^\s]+)/g;
+  return text.split(urlRegex).map((part, index) =>
+    part.match(urlRegex) ? (
+      <a key={index} href={part} target="_blank" rel="noopener noreferrer">
+        {part}
+      </a>
+    ) : (
+      part
+    )
+  );
+};
 class News extends Component {
  UNSAFE_componentWillMount() {
    this.props.getNews();
@@ -61,7 +74,7 @@ class News extends Component {
  renderMultiLine = (text) => {
    const strings = text.split('\n');
-    return strings.map((string) => <p key={Math.random()}>{string}</p>);
+    return strings.map((string) => <p key={Math.random()}>{linkify(string)}</p>);
  };
  render() {

--- a/src/components/pages/Profile.js
+++ b/src/components/pages/Profile.js
-import { Container, Divider, Dropdown, Form, Segment } from 'semantic-ui-react';
+import { Container, Divider, Dropdown, Form, Segment } from "semantic-ui-react";
-import React, { Component } from 'react';
+import React, { Component } from "react";
-import { groupChange, submitRegistration, textChange } from '../../actions';
+import { groupChange, submitRegistration, textChange } from "../../actions";
-import HiddenForm from '../forms/HiddenForm';
+import HiddenForm from "../forms/HiddenForm";
-import { connect } from 'react-redux';
+import { connect } from "react-redux";
-import { getDeadline } from '../../actions/auth';
+import { getDeadline } from "../../actions/auth";
 const options = [
-  { key: 'DT', text: 'DevTeam', value: 'DT' },
+  { key: "DT", text: "DevTeam", value: "DT" },
-  { key: 'NET', text: 'NETeam', value: 'NET' },
+  { key: "NET", text: "NETeam", value: "NET" },
-  { key: 'ST', text: 'SecurITeam', value: 'ST' },
+  { key: "ST", text: "SecurITeam", value: "ST" },
-  { key: 'SYS', text: 'SysAdmin', value: 'SYS' },
+  { key: "SYS", text: "SysAdmin", value: "SYS" },
-  { key: 'HAT', text: 'Hallgatói Tudásbázis', value: 'HAT' },
+  { key: "HAT", text: "Hallgatói Tudásbázis", value: "HAT" },
 ];
 class Profile extends Component {
  UNSAFE_componentWillMount() {
    this.props.getDeadline();
    if (!this.props.id) {
-      this.props.history.push('/home');
+      this.props.history.push("/home");
    }
  }
@@ -40,20 +40,20 @@ class Profile extends Component {
    return (
      <Container
        style={{
-          marginTop: '1em',
+          marginTop: "1em",
        }}
      >
        {canEdit ? (
          <Segment inverted color="red" tertiary>
            <p
-              style={{ fontSize: '1.3em' }}
+              style={{ fontSize: "1.3em" }}
              dangerouslySetInnerHTML={{ __html: messageBefore }}
            />
          </Segment>
        ) : (
          <Segment inverted color="red" tertiary>
            <p
-              style={{ fontSize: '1.3em' }}
+              style={{ fontSize: "1.3em" }}
              dangerouslySetInnerHTML={{ __html: messageAfter }}
            />
          </Segment>
@@ -134,29 +134,30 @@ class Profile extends Component {
                    </li>
                    <br />
                    <li>
-                      Két előadás közti szünetben úgy döntesz, hogy laptopoddal
+                      Kicsit hosszúra nyúlt az előadás és lassan rohannod kell
-                      az index.hu tech cikkeit fogod görgetni. Ám az oldal nem
+                      haza, ezért úgy döntesz, hogy megnézed a menetrendet a
-                      válaszol, a hiba okát megpróbálod kideríteni. Ekkor veszed
+                      menetrendek.hu weboldalon. Ám az oldal nem válaszol, a
-                      észre, hogy az alábbiakat sem éred el: sze.hu,
+                      hiba okát megpróbálod kideríteni. Ekkor veszed észre, hogy
-                      corvinus.hu, startlap.hu. Ugyanakkor a Facebook, a Gmail,
+                      az alábbiakat sem éred el: sze.hu, corvinus.hu,
-                      a YouTube, de még az egyetemi oldalak többsége is működik.
+                      startlap.hu. Ugyanakkor a Facebook, a Gmail, a YouTube, de
-                      Szerinted mi lehet a hiba oka?
+                      még az egyetemi oldalak többsége is működik. Szerinted mi
+                      lehet a hiba oka?
                    </li>
                    <br />
                    <li>
-                      Találsz egy értelmetlen szöveget egy honlapon (például:{' '}
+                      Találsz egy értelmetlen szöveget egy honlapon (például:{" "}
-                      <a href="https://ujonc.kszk.bme.hu/mediafiles/public/zebra.html">
+                      <a href="https://ujonc.kszk.bme.hu/kepzes-media/public/zebra.html">
-                        https://ujonc.kszk.bme.hu/mediafiles/public/zebra.html
+                        https://ujonc.kszk.bme.hu/kepzes-media/public/zebra.html
                      </a>
-                      ), de feltűnik, hogy két egyenlőségjellel fejeződik be.
+                      ), de feltűnik, hogy egyenlőségjellel fejeződik be.
                      Nyomozz, s a végeredményt (amit találtál) írd ide!
                    </li>
                    <br />
                    <li>
-                      A <b>ujonc-gres.sch.bme.hu</b> címen elérhető gépen fut
+                      A <b>ujonc-gres.kszk.bme.hu</b> címen elérhető gépen fut
                      egy szolgáltatás az alapértelmezett <b>5432</b> porton
                      (használd az előző feladatban kapott adatokat). Belépés
-                      után keresd meg a feladat megoldását!
+                      után írd le mit találtál!
                    </li>
                  </ul>
                </div>
@@ -186,26 +187,27 @@ class Profile extends Component {
                    </li>
                    <br />
                    <li>
-                      Két előadás közti szünetben úgy döntesz, hogy laptopoddal
+                      Kicsit hosszúra nyúlt az előadás és lassan rohannod kell
-                      az index.hu tech cikkeit fogod görgetni. Ám az oldal nem
+                      haza, ezért úgy döntesz, hogy megnézed a menetrendet a
-                      válaszol, a hiba okát megpróbálod kideríteni. Ekkor veszed
+                      menetrendek.hu weboldalon. Ám az oldal nem válaszol, a
-                      észre, hogy az alábbiakat sem éred el: sze.hu,
+                      hiba okát megpróbálod kideríteni. Ekkor veszed észre, hogy
-                      corvinus.hu, startlap.hu. Ugyanakkor a Facebook, a Gmail,
+                      az alábbiakat sem éred el: sze.hu, corvinus.hu,
-                      a YouTube, de még az egyetemi oldalak többsége is működik.
+                      startlap.hu. Ugyanakkor a Facebook, a Gmail, a YouTube, de
-                      Szerinted mi lehet a hiba oka?
+                      még az egyetemi oldalak többsége is működik. Szerinted mi
+                      lehet a hiba oka?
                    </li>
                    <br />
                    <li>
-                      Találsz egy értelmetlen szöveget egy honlapon (például:{' '}
+                      Találsz egy értelmetlen szöveget egy honlapon (például:{" "}
-                      <a href="https://ujonc.kszk.bme.hu/mediafiles/public/zebra.html">
+                      <a href="https://ujonc.kszk.bme.hu/kepzes-media/public/zebra.html">
-                        https://ujonc.kszk.bme.hu/mediafiles/public/zebra.html
+                        https://ujonc.kszk.bme.hu/kepzes-media/public/zebra.html
                      </a>
-                      ), de feltűnik, hogy két egyenlőségjellel fejeződik be.
+                      ), de feltűnik, hogy egyenlőségjellel fejeződik be.
                      Nyomozz, s a végeredményt (amit találtál) írd ide!
                    </li>
                    <br />
                    <li>
-                      A <b>ujonc-gres.sch.bme.hu</b> címen elérhető gépen fut
+                      A <b>ujonc-gres.kszk.bme.hu</b> címen elérhető gépen fut
                      egy szolgáltatás az alapértelmezett <b>5432</b> porton
                      (használd az előző feladatban kapott adatokat). Belépés
                      után keresd meg a feladat megoldását!
@@ -217,7 +219,7 @@ class Profile extends Component {
            />
          )}
-          <Divider horizontal>Érdekelődés</Divider>
+          <Divider horizontal>Érdeklődés</Divider>
          <Dropdown
            fluid
            multiple
@@ -239,12 +241,12 @@ class Profile extends Component {
            }
            checked={signed}
            readOnly={!canEdit}
-            style={!canEdit ? { marginBottom: '5em' } : null}
+            style={!canEdit ? { marginBottom: "5em" } : null}
          />
          {canEdit ? (
            <Form.Button
              primary
-              style={{ marginBottom: '5em' }}
+              style={{ marginBottom: "5em" }}
              disabled={!signed}
              onClick={() =>
                this.props.submitRegistration({
@@ -261,7 +263,7 @@ class Profile extends Component {
              Mentés
            </Form.Button>
          ) : (
-            ''
+            ""
          )}
        </Form>
      </Container>

--- a/src/components/pages/Schedule.js
+++ b/src/components/pages/Schedule.js
-import 'moment/locale/hu';
+import "moment/locale/hu";
 import {
  Accordion,
@@ -7,12 +7,12 @@ import {
  Header,
  Icon,
  Segment,
-} from 'semantic-ui-react';
+} from "semantic-ui-react";
-import React, { Component } from 'react';
+import React, { Component } from "react";
-import { connect } from 'react-redux';
+import { connect } from "react-redux";
-import { getStudentEvents } from '../../actions/statistics';
+import { getStudentEvents } from "../../actions/statistics";
-import moment from 'moment';
+import moment from "moment";
 class Schedule extends Component {
  // eslint-disable-next-line react/state-in-constructor
@@ -34,32 +34,34 @@ class Schedule extends Component {
    const { activeIndex } = this.state;
    const { events } = this.props;
-    const panels = events.map((event) => (
+    const panels = events
-      <Accordion key={Math.random()}>
+      .sort((a, b) => a.date - b.date)
-        <Accordion.Title
+      .map((event) => (
-          active={activeIndex === event.id}
+        <Accordion key={Math.random()}>
-          index={event.id}
+          <Accordion.Title
-          onClick={this.handleClick}
+            active={activeIndex === event.id}
-        >
+            index={event.id}
-          <h2>
+            onClick={this.handleClick}
-            <Grid>
+          >
-              <Grid.Column floated="left" width={5} textAlign="left">
+            <h2>
-                <Icon name="calendar alternate outline" color="blue" />{' '}
+              <Grid>
-                {event.name}
+                <Grid.Column floated="left" width={5} textAlign="left">
-              </Grid.Column>
+                  <Icon name="calendar alternate outline" color="blue" />{" "}
-              <Grid.Column floated="right" width={8} textAlign="right">
+                  {event.name}
-                {moment(event.date).locale('hu').format('LLLL')}
+                </Grid.Column>
-              </Grid.Column>
+                <Grid.Column floated="right" width={8} textAlign="right">
-            </Grid>
+                  {moment(event.date).locale("hu").format("LLLL")}
-          </h2>
+                </Grid.Column>
-        </Accordion.Title>
+              </Grid>
-        <Accordion.Content active={activeIndex === event.id}>
+            </h2>
-          <Segment textAlign="left" style={{ overflowWrap: 'break-word' }}>
+          </Accordion.Title>
-            {event.description}
+          <Accordion.Content active={activeIndex === event.id}>
-          </Segment>
+            <Segment textAlign="left" style={{ overflowWrap: "break-word" }}>
-        </Accordion.Content>
+              {event.description}
-      </Accordion>
+            </Segment>
-    ));
+          </Accordion.Content>
+        </Accordion>
+      ));
    return (
      <div>
@@ -68,10 +70,10 @@ class Schedule extends Component {
            as="h1"
            content="Képzés alkalmak"
            style={{
-              fontSize: '2em',
+              fontSize: "2em",
-              fontWeight: 'bold',
+              fontWeight: "bold",
-              marginBottom: '0.5em',
+              marginBottom: "0.5em",
-              marginTop: '0.5em',
+              marginTop: "0.5em",
            }}
          />
          <Accordion fluid styled>
@@ -79,12 +81,12 @@ class Schedule extends Component {
          </Accordion>
          <Header
            as="h1"
-            content="Tábor"
+            content="Tábor: április 11-13"
            style={{
-              fontSize: '2em',
+              fontSize: "2em",
-              fontWeight: 'bold',
+              fontWeight: "bold",
-              marginBottom: '0.5em',
+              marginBottom: "0.5em",
-              marginTop: '1.5em',
+              marginTop: "1.5em",
            }}
          />
        </Container>

--- a/src/setupProxy.js
+++ b/src/setupProxy.js
-const { createProxyMiddleware } = require('http-proxy-middleware');
+const { createProxyMiddleware } = require("http-proxy-middleware");
 module.exports = function (app) {
  app.use(
-    '/api',
+    "/api",
    createProxyMiddleware({
-      target: 'http://localhost:8000',
+      target: "http://localhost:8000",
      changeOrigin: true,
-    })
+    }),
  );
  app.use(
-    '/admin',
+    "/admin",
    createProxyMiddleware({
-      target: 'http://localhost:8000',
+      target: "http://localhost:8000",
      changeOrigin: true,
-    })
+    }),
  );
  app.use(
-    '/staticfiles',
+    "/staticfiles",
    createProxyMiddleware({
-      target: 'http://localhost:8000',
+      target: "http://localhost:8000",
      changeOrigin: true,
-    })
+    }),
  );
  app.use(
-    '/mediafiles',
+    "/mediafiles",
    createProxyMiddleware({
-      target: 'http://localhost:8000',
+      target: "http://localhost:8000",
      changeOrigin: true,
-    })
+    }),
+  );
+  app.use(
+    "/oidc",
+    createProxyMiddleware({
+      target: "http://localhost:8000",
+      changeOrigin: true,
+    }),
  );
 };
No results found