/.test(\r\n `${program.image}${program.description}${program.team}${program.genre}`\r\n )\r\n ) {\r\n function removeHtml(text) {\r\n const div = document.createElement('div');\r\n div.innerHTML = text;\r\n return div.textContent.trim();\r\n }\r\n if (program.image) program.image = removeHtml(program.image);\r\n if (program.description)\r\n program.description = removeHtml(program.description);\r\n if (program.team) program.team = removeHtml(program.team);\r\n if (program.genre) program.genre = removeHtml(program.genre);\r\n }\r\n });\r\n\r\n const images = data.map((p) => p.image || '');\r\n preloadImages(images);\r\n\r\n const r = data.sort((x, y) => +x.start - y.start);\r\n const grouped = groupBy(r, (x) => startOfDay(x.start));\r\n\r\n setToday(currentDateWithinBounds());\r\n setAll(grouped);\r\n } catch (error) {\r\n console.error(error);\r\n }\r\n };\r\n fetchProgrammes();\r\n }\r\n }, []);\r\n\r\n const bottomControlUsed = useRef(false);\r\n const topControls = useRef();\r\n\r\n const incrementDay = useCallback(\r\n (e) => {\r\n bottomControlUsed.current = e.currentTarget.dataset.bottom;\r\n setToday(startOfDay(Math.min(today + 86400000, endDate)));\r\n },\r\n [today]\r\n );\r\n const decrementDay = useCallback(\r\n (e) => {\r\n bottomControlUsed.current = e.currentTarget.dataset.bottom;\r\n setToday(startOfDay(Math.max(today - 86400000, startDate)));\r\n },\r\n [today]\r\n );\r\n\r\n useEffect(() => {\r\n // Forced scrolling is annoying but better than the bottom button jumping around when days change\r\n if (bottomControlUsed.current && topControls.current)\r\n topControls.current.scrollIntoView();\r\n }, [today]);\r\n\r\n if (!all || !today) return null;\r\n\r\n const locales = [t('frontpage.calendar.dateLocale'), 'fi-FI', 'fi'];\r\n const dateOptions = {\r\n weekday: 'long',\r\n year: 'numeric',\r\n month: 'numeric',\r\n day: 'numeric',\r\n };\r\n const date = new Date(today).toLocaleDateString(locales, dateOptions);\r\n\r\n if (oneDayPreview) {\r\n if (all[today]) {\r\n const currentProgram = all[today].find((program) => {\r\n const now = new Date();\r\n const start = program.start;\r\n const end = program.end;\r\n const hasNotEnded = end > now;\r\n const hasStarted = start < now;\r\n return hasStarted && hasNotEnded;\r\n });\r\n\r\n if (!currentProgram) {\r\n return null;\r\n }\r\n return \r\n
{t('frontpage.calendar.title')} \r\n \r\n {t('frontpage.calendar.prev')} \r\n {date} \r\n {t('frontpage.calendar.next')} \r\n \r\n\r\n {content}\r\n \r\n );\r\n};\r\n\r\nexport default SignUpCalendar;\r\n","import React from 'react';\nimport styled from 'styled-components';\nimport Link from '../../common/Link';\nimport { useState } from 'react';\n\nimport RegistrationForm from './RegistrationForm';\nimport Countdown from '../../common/Countdown';\nimport { linkToTelegramChat } from '../../../utils';\nimport { useTranslation, Trans } from 'react-i18next';\nimport SignUpCalendar from '../../calendar/SignUpCalendar.js';\n\nconst Main = styled.main`\n background-color: ${(p) => p.theme.color.containerBg};\n padding: 1rem;\n\n p {\n max-width: 800px;\n }\n`;\nexport const signupOpens = new Date('2025-03-04T12:00:00+03:00'); // new Date('2025-03-04T12:00:00+02:00'); // initial signup\nexport const signupCloses = new Date('2025-05-1T23:59:59+02:00');\nexport const postSignupOpens = new Date('2025-03-27T21:00:00+02:00'); // signup for remaining spots\nexport const postSignupCloses = new Date('2025-05-30T01:00:00+02:00');\n\nconst Registration = () => {\n const { t } = useTranslation();\n const [showCountdown] = useState(new Date() < signupOpens);\n\n if (new Date() >= postSignupCloses) {\n return (\n \n {t('signup.closed.title')} \n \n ]}\n />\n
\n \n );\n }\n\n return (\n <>\n {showCountdown && (\n \n
\n )}\n \n {/* {new Date() >= postSignupOpens ? (\n {t('signup.postregistration.open')} \n ) : new Date() >= signupCloses ? (\n {t('signup.postregistration.soon')} \n ) : new Date() >= signupOpens ? (\n {t('signup.signup.title')} \n ) : (\n {t('signup.preRegistration.pageTitle')} \n )} */}\n\n {/* {new Date() >= postSignupOpens && (\n \n {t('signup.notice')} \n \n )} */}\n {t('signup.title')} \n\n {t('signup.paragraph1')}
\n \n \n {' '}\n ,\n \n {' '}\n ,\n ]}\n />\n
\n \n
\n \n {t('signup.paragraph4')}{' '}\n toimitus@radiodiodi.fi \n
\n \n \n );\n};\n\nexport default Registration;\n","import React, { useState, useRef, useEffect } from 'react';\nimport axios from 'axios';\nimport useSWR from 'swr';\nimport styled from 'styled-components';\nimport { environment } from '../../../utils';\nimport { useTranslation } from 'react-i18next';\n\nconst Container = styled.div`\n p {\n max-width: 700px;\n }\n`;\n\nconst Results = styled.div``;\n\nconst Result = styled.div`\n color: ${(p) => (p.header ? p.theme.color.boldText : p.theme.color.bodyText)};\n font-weight: ${(p) => (p.header ? 'bold' : 'inherit')};\n background-color: ${(p) =>\n p.contrast ? p.theme.color.white10 : p.theme.color.white30};\n padding: 0.5rem 0.3rem;\n margin: 0.2rem 0;\n display: flex;\n flex-direction: row;\n\n @media screen and (max-width: 500px) {\n flex-direction: column;\n\n div:not(:first-child) {\n margin-top: 0.5rem;\n }\n }\n`;\n\nconst Error = styled.h2`\n text-align: center;\n margin: 1rem auto;\n font-weight: 400;\n color: ${(p) => p.theme.color.boldText};\n`;\n\nconst Column = styled.div`\n flex: 1;\n margin-left: 0.5rem;\n line-height: 1.2;\n`;\n\nconst SearchBar = styled.input`\n padding: 0.5rem;\n flex: 1;\n`;\n\nconst SearchContainer = styled.div`\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n margin-bottom: 2rem;\n`;\n\nconst Button = styled.button`\n background: none;\n background-color: ${(p) => p.theme.color.boldText};\n border: none;\n cursor: pointer;\n font-weight: 700;\n color: white;\n padding: 1em 2em;\n letter-spacing: 0.05rem;\n\n &:hover,\n &:active {\n background-color: ${(p) => p.theme.color.redMedium};\n }\n\n &:disabled {\n background-color: ${(p) => p.theme.color.bodyText};\n cursor: default;\n color: #dbdbdb;\n border: none;\n }\n`;\n\nconst SearchButton = styled(Button)`\n padding: 0.5rem;\n min-width: 5rem;\n text-align: center;\n cursor: pointer;\n`;\n\nconst TypePickerContainer = styled.div`\n display: flex;\n flex-wrap: wrap;\n justify-content: flex-start;\n margin-top: 1rem;\n gap: 0.2rem;\n`;\n\nconst Tab = styled.label`\n display: flex;\n flex-direction: row;\n align-items: center;\n\n input {\n display: none;\n }\n\n label {\n padding: 0.5rem 1rem;\n background-color: ${(p) => p.theme.color.white10};\n cursor: pointer;\n }\n\n label:hover {\n background-color: ${(p) => p.theme.color.redMedium};\n }\n\n input:checked + label {\n background-color: ${(p) => p.theme.color.boldText};\n color: ${(p) => p.theme.color.white100};\n }\n`;\n\nconst TypePicker = ({ type, setType }) => {\n const { t } = useTranslation();\n return (\n \n \n setType('title')}\n checked={type === 'title'}\n />\n {t('library.song')} \n \n \n setType('artist')}\n checked={type === 'artist'}\n />\n {t('library.artist')} \n \n \n setType('album')}\n checked={type === 'album'}\n />\n {t('library.album')} \n \n \n );\n};\n\nconst Search = ({ onInput, forwardRef }) => {\n const { t } = useTranslation();\n const onPromptKeyPress = (event) => {\n const ENTER_KEY = 13;\n\n if ([event.keyCode, event.which].includes(ENTER_KEY)) {\n onInput();\n }\n };\n\n return (\n \n {t('library.search')} \n \n );\n};\n\nconst PaginationContainer = styled.div`\n display: flex;\n justify-content: center;\n align-items: center;\n margin: 2rem 0;\n\n @media screen and (max-width: 500px) {\n flex-direction: column;\n }\n\n span {\n margin: 1rem 4rem;\n }\n`;\n\nconst Pagination = ({ index, setIndex, amountOfRows }) => {\n const { t } = useTranslation();\n const ROWS_PER_PAGE = 50;\n\n const isPreviousDisabled = index <= 1;\n const isNextDisabled = index * ROWS_PER_PAGE >= amountOfRows;\n if (isPreviousDisabled && isNextDisabled) {\n return null;\n }\n return (\n \n setIndex(index - 1)}>\n {t('library.previous')}\n \n \n {t('library.page')}: {index}\n \n setIndex(index + 1)}>\n {t('library.next')}\n \n \n );\n};\n\nconst BACKEND_URL = environment.REACT_APP_BACKEND_HTTP_URL;\nconst fetcher = (queryString) =>\n axios\n .get(`${BACKEND_URL}/library/search?${queryString}`)\n .then((res) => res.data);\n\nconst createQueryString = (type, query, pageIndex) =>\n `type=${type}&search=${encodeURIComponent(query)}&page=${pageIndex}`;\n\nconst swrConfig = {\n dedupingInterval: 864000,\n revalidateOnFocus: false,\n revalidateOnReconnect: false,\n errorRetryCount: 3,\n};\n\n// component used to only prefetch the data on\n// the next page so that it's already loaded when\n// the user decides to go there\nconst Prefetch = ({ type, query, pageIndex }) => {\n const queryString = createQueryString(type, query, pageIndex + 1);\n useSWR(queryString, fetcher, swrConfig);\n\n return null;\n};\n\nconst Library = () => {\n const [pageIndex, setPageIndex] = useState(1);\n const [type, setType] = useState('title');\n const [query, setQuery] = useState('');\n const inputRef = useRef();\n\n const queryString = createQueryString(type, query, pageIndex);\n const { data, error } = useSWR(queryString, fetcher, swrConfig);\n\n const { t } = useTranslation();\n\n // scroll to top when the data is updated i.e.\n // the user has navigated to other page\n useEffect(() => {\n inputRef.current.scrollIntoView({ behavior: 'smooth' });\n }, [inputRef, data]);\n\n const renderResult = (result, index) => {\n if (!result || !result.title) return null;\n\n const artistData = Array.isArray(result.artist)\n ? result.artist.join(', ')\n : result.artist;\n\n const even = index % 2 === 0;\n\n return (\n \n {result.title} \n {artistData} \n {result.album} \n \n );\n };\n\n const renderResults = (results) => {\n if (!results || !Array.isArray(results)) {\n return null;\n }\n\n if (results.length === 0) {\n return {t('library.noResults')} ;\n }\n\n const rows = results.map((r, i) => renderResult(r, i));\n return (\n \n \n {t('library.song')} \n {t('library.artist')} \n {t('library.album')} \n \n {rows}\n \n );\n };\n\n const onInput = () => {\n setPageIndex(1);\n const query = inputRef.current.value;\n setQuery(query);\n };\n\n const onTypeSelect = (type) => {\n setType(type);\n onInput();\n };\n\n return (\n \n {t('library.musicLibrary')} \n {t('library.info')}
\n\n {t('library.fetching')} }\n {error && {t('library.error')} }\n {data && renderResults(data.result)}\n \n );\n};\n\nexport default Library;\n","import React, { Component } from 'react';\nimport styled from 'styled-components';\nimport GoogleLogin from 'react-google-login';\nimport { checkJWTAuth } from '../../../utils';\nimport Cookie from 'universal-cookie';\nimport { parseSearch, environment } from '../../../utils';\n\nconst cookie = new Cookie();\n\nconst CLIENT_ID = environment.REACT_APP_OAUTH_CLIENT_ID;\n\nconst Container = styled.div`\n display: block;\n\n i,\n button {\n display: block;\n }\n`;\n\nconst Login = styled(GoogleLogin)`\n padding: 1rem 1.5rem;\n margin: 1rem 0;\n font-size: 1rem;\n background-color: ${p => p.theme.color.pink100};\n color: ${p => p.theme.color.white100};\n outline: none;\n border: none;\n cursor: pointer;\n`;\n\nconst Error = styled.i`\n color: ${p => p.theme.color.turquoise100};\n margin: 1rem 0;\n`;\n\nclass LoginPage extends Component {\n constructor(props) {\n super(props);\n this.state = {\n error: '',\n }\n const jwt = cookie.get('jwt');\n if (jwt) {\n this.responseGoogle({\n tokenId: jwt\n });\n }\n }\n\n responseGoogle = async resp => {\n console.log(resp);\n if (resp.error) {\n console.log('Login error.')\n cookie.remove('jwt');\n this.setState({\n error: resp.error,\n });\n return;\n }\n\n const { location, history } = this.props;\n const { search } = location;\n const params = parseSearch(search);\n const next = params.next || '/admin';\n\n const id_token = resp.tokenId;\n const ok = await checkJWTAuth(id_token);\n if (ok) {\n cookie.set('jwt', id_token);\n history.push(next);\n } else {\n cookie.remove('jwt');\n console.log('Backend auth verification failed.');\n this.setState({\n error: 'Backend auth verification failed.',\n });\n }\n }\n\n render() {\n const { error } = this.state;\n return (\n \n Log in to Radiodiodi admin \n Use your Radiodiodi.fi domain email. \n Error: {error} }\n \n );\n }\n}\n\nexport default LoginPage;\n","import React, { Fragment } from 'react';\nimport { Trans, useTranslation } from 'react-i18next';\nimport styled from 'styled-components';\nimport Link from '../../common/Link';\n\nconst Container = styled.div`\n`;\n\nconst Question = styled.i`\n &::before {\n content: 'Q: ';\n }\n\n display: block;\n margin: 1rem 0 0.5rem;\n`;\n\nconst Answer = styled.div`\n margin: 1rem 0 3rem 1.4rem;\n`;\n\nconst EmailLink = ({ children }) => {children} ;\n\n// Stuff that can be interpolated into translation strings\nconst faqComponents = {\n email: radiodiodi.m3u ,\n flac: https://virta.radiodiodi.fi/flac ,\n mp3: https://virta.radiodiodi.fi/mp3 ,\n aac: https://virta.radiodiodi.fi/aac ,\n fb2k: Foobar2000 ,\n vlc: VLC ,\n};\n\nconst qas = [\n {\n question: 'faq.what.q',\n answer: 'faq.what.a',\n },\n {\n question: 'faq.frequency.q',\n answer: 'faq.frequency.a',\n },\n {\n question: 'faq.streams.q',\n answer: 'faq.streams.a',\n },\n {\n question: 'faq.when.q',\n answer: 'faq.when.a',\n },\n {\n question: 'faq.where.q',\n answer: 'faq.where.a',\n },\n {\n question: 'faq.who.q',\n answer: 'faq.who.a',\n },\n {\n question: 'faq.idea.q',\n answer: 'faq.idea.a',\n },\n // , jotta toimitus voi valmistella studion erikoisempaa ohjelmaa varten. Autamme mielellämme typerienkin ideoidesi toteuttamisessa\n {\n question: 'faq.howMany.q',\n answer: 'faq.howMany.a',\n },\n {\n question: 'faq.music.q',\n answer: 'faq.music.a',\n },\n {\n question: 'faq.notAllowed.q',\n answer: 'faq.notAllowed.a',\n },\n {\n question: 'faq.tech.q',\n answer: 'faq.tech.a',\n },\n // {\n // question: 'Saako studiossa syödä/juoda? Entä alkoholi?',\n // answer: 'Vältä syömistä studiotiloissa. Alkoholi on kielletty sillä lähetys tapahtuu koulun tiloista.'\n // // answer: 'Kunhan laitteet pysyvät ehjänä ja kunnossa, mikään ei estä studiossa syömistä tai juomista.'\n // },\n {\n question: 'faq.ads.q',\n answer: 'faq.ads.a',\n },\n {\n question: 'faq.jingle.q',\n answer: 'faq.jingle.a',\n },\n {\n question: 'faq.ownJingle.q',\n answer: 'faq.ownJingle.a',\n },\n {\n question: 'faq.record.q',\n answer: 'faq.record.a',\n },\n {\n question: 'faq.prerecord.q',\n answer: 'faq.prerecord.a',\n },\n {\n question: 'faq.remote.q',\n answer: 'faq.remote.a',\n },\n {\n question: 'faq.producer.q',\n answer: 'faq.producer.a',\n },\n {\n question: 'faq.producing.q',\n answer: 'faq.producing.a',\n // answer: 'Laita sähköpostia studio@radiodiodi.fi ja liity Radiodiodin Telegram-kanaville. Tuottajakoulutuksia järjestetään kiinnostuneille studion rakennusviikolla ja ensimmäisen lähetysviikon aikana.'\n },\n {\n question: 'faq.needProducer.q',\n answer: 'faq.needProducer.a',\n },\n {\n question: 'faq.rekry.q',\n answer: 'faq.rekry.a',\n }\n];\n\nconst FAQ = () => {\n const { t } = useTranslation();\n\n return (\n \n {t('faq.title')} \n {t('faq.facts.title')} \n \n {t('faq.facts.laws')} \n {t('faq.facts.editor')} \n {t('faq.facts.finance')} \n {/* Radio-ohjelman tuottaa Radiodiodin tuottaja tai koulutettu ohjelmantekijä. */}\n {t('faq.facts.fun')} \n {t('faq.facts.experience')} \n \n \n \n \n \n \n \n ))}\n \n );\n}\n\nexport default FAQ;\n","import React, { Component } from 'react';\nimport styled from 'styled-components';\nimport i18next from '../../../i18n';\n\nconst Container = styled.div`\n`;\n\nconst DurationInput = styled.input`\n padding: 0.5rem;\n margin-left: 1rem;\n`;\n\nconst InputLabel = styled.label`\n display: flex;\n justify-content: flex-start;\n align-items: center;\n`;\n\nconst Subtitle = styled.h4`\n`;\n\nconst AmountContainer = styled.div`\n padding: 1rem 2rem;\n`;\n\nconst Row = styled.div`\n line-height: 1.5rem;\n`;\n\nclass Programme extends Component {\n state = {\n duration: 1,\n }\n\n onInputChange = evt => {\n this.setState({\n duration: evt.target.value,\n });\n }\n\n calculateAmounts = hours => {\n const t = i18next.t;\n const calc = perc => {\n const num = perc * hours;\n const wholes = Math.floor(num);\n const decimals = num - wholes;\n const mins = Math.floor(decimals * 60);\n\n const hourPart = wholes > 0 ? t('calculator.hour', { count: wholes }) : '';\n const minutePart = mins > 0 ? t('calculator.minute', { count: mins }) : '';\n return `${hourPart} ${minutePart}`;\n };\n\n return {\n ads: calc(0.05),\n speech: calc(0.50),\n music: calc(0.35),\n jingles: calc(0.10),\n }\n }\n\n render() {\n const { duration } = this.state;\n const amounts = this.calculateAmounts(Math.abs(duration));\n const t = i18next.t;\n return (\n \n {t('calculator.title')} \n {t('calculator.description')}
\n \n {t('calculator.input')}\n \n\n {t('calculator.structure')} \n \n {t('calculator.talk')}: {amounts.speech}
\n {t('calculator.music')}: {amounts.music}
\n {t('calculator.jingles')}: {amounts.jingles}
\n {t('calculator.ads')}: {amounts.ads}
\n \n \n );\n }\n}\n\nexport default Programme;\n","import React from 'react';\nimport styled from 'styled-components';\nimport Link from '../../common/Link';\nimport Programme from './Programme';\nimport { useTranslation, Trans } from 'react-i18next';\n\nconst Container = styled.div`\n strong {\n color: ${(p) => p.theme.color.boldText};\n }\n`;\n\nconst TranslationWithStrong = (key) => {\n return \n {t('checklist.title')} \n \n {t('checklist.1')} \n {t('checklist.2')} \n {t('checklist.3')} \n \n \n \n {t('checklist.5')}:{' '}\n toimitus@radiodiodi.fi \n \n \n ]}\n />\n \n {t('checklist.7')} \n {t('checklist.8')} \n {t('checklist.9')} \n {/*Osallistu kaatoon! */}\n \n\n {t('checklist.planning.title')} \n {TranslationWithStrong('checklist.planning.name')}
\n {TranslationWithStrong('checklist.planning.description')}
\n {TranslationWithStrong('checklist.planning.goal')}
\n {TranslationWithStrong('checklist.planning.theme')}
\n {/* Aikataulu. Aamuyön ohjelma voi olla hyvinkin erilaista kuin keskipäivän ohjelma.
*/}\n {TranslationWithStrong('checklist.planning.audience')}
\n {TranslationWithStrong('checklist.planning.elements')}
\n {TranslationWithStrong('checklist.planning.ads')}
\n \n \n {t('guide')} \n \n \n \n \n \n );\n}\n\nexport default Guide;\n","import React from 'react';\nimport { parseSearch } from '../../../utils';\n\nconst CalendarCallback = ({ location }) => {\n const { search } = location;\n const queryParams = parseSearch(search);\n return (\n \n
Google calendar authorization \n
Copy and paste this to your terminal:
\n
\n { queryParams.code || 'No code in query params. Something went wrong!' }\n \n
There might be no prompt for the code but paste it anyway. Restart your backend afterwards!
\n
\n \n {t('signup.success.title')} \n \n {t('signup.success.thanks')}\n \n { email && (\n \n {t('signup.success.email')} { email }.\n \n )}\n {/* \n Ohjelmantekijät kuvataan 3.4. ja 4.4. myöhemmin ilmoitettavassa paikassa. Jos jäi kysymyksiä, vastauksia löytyy postilokerosta toimitus@radiodiodi.fi. \n */}\n \n \n );\n }\n}\n\nexport default withTranslation()(RegistrationSuccess);\n","import React, { Component } from 'react';\nimport styled from 'styled-components';\nimport i18next from '../../../i18n';\nimport { Trans, withTranslation } from 'react-i18next';\n\nconst Container = styled.div`\n margin-bottom: 2rem;\n`;\n\nconst Paragraph = styled.div`\n max-width: 700px;\n flex-grow: 1;\n\n hr {\n width: 50%;\n text-align: left;\n }\n`;\n\nconst Title = styled.h3`\n margin: 0;\n height: 4rem;\n`;\n\nclass RegistrationError extends Component {\n render() {\n const t = i18next.t;\n return (\n \n \n {t('signup.error.title')} \n \n ]} />\n \n \n \n );\n }\n}\n\nexport default withTranslation()(RegistrationError);\n","import React from 'react';\nimport Cookie from 'universal-cookie';\nimport styled from 'styled-components';\nimport { withRouter } from 'react-router';\n\nconst cookie = new Cookie();\n\nconst Button = styled.button`\n outline: none;\n border: none;\n padding: 0.5rem 1rem;\n color: ${(p) => p.theme.color.white100};\n background-color: ${(p) => p.theme.color.boldText};\n font-size: 16px;\n cursor: pointer;\n`;\n\nconst paths = ['/', '/admin'];\n\nconst logout = (history) => () => {\n paths.forEach((path) => {\n cookie.remove('jwt', { path });\n });\n\n history.push('/login');\n};\n\nconst LogoutButton = ({ history }) => {\n return Log out ;\n};\n\nexport default withRouter(LogoutButton);\n","import React from 'react';\nimport styled from 'styled-components';\nimport { Link } from 'react-router-dom';\nimport { withRouter } from 'react-router';\nimport LogoutButton from './LogoutButton';\n\nexport const errorStatusCodes = [401, 500];\n\nconst Row = styled.div`\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n\n a {\n margin-right: 0.5rem;\n }\n\n @media screen and (max-width: 600px) {\n flex-flow: column nowrap;\n align-items: flex-end;\n\n a,\n button {\n margin-bottom: 0.5rem;\n }\n }\n`;\n\nconst AdminNavbar = () => {\n return (\n \n
\n );\n};\n\nexport default withRouter(AdminNavbar);\n","import styled from 'styled-components';\n\nexport const Container = styled.div`\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n flex-wrap: nowrap;\n`;\n\nexport const Column = styled.div`\n ${(p) => p.hidden && 'display: none'};\n margin: 0.5rem 0;\n flex: 1 0 auto;\n\n @media screen and (min-width: 500px) {\n min-width: 400px;\n }\n\n max-width: 100%;\n`;\n\nexport const Log = styled.div`\n max-height: 20rem;\n overflow-y: auto;\n overflow-x: hidden;\n margin-bottom: 2rem;\n`;\n\nexport const Count = styled.div`\n margin: 0.5rem 0;\n`;\n\nexport const LogRow = styled.div`\n margin: 0.5rem 0;\n cursor: pointer;\n\n &:hover {\n padding-left: 8px;\n border-left: 4px solid ${(p) => p.theme.color.boldText};\n }\n\n transition: 0.5s padding-left;\n transition: 0.1s border-left;\n min-width: 0;\n`;\n\nexport const LogRowContrast = styled.span`\n color: ${(p) => p.theme.color.boldText};\n`;\n","import React, { Component } from 'react';\nimport { LogRow, LogRowContrast } from './Styles';\n\nclass Registration extends Component {\n render() {\n const { data, onSelect } = this.props;\n return (\n onSelect(data)}>\n {data.timestamp}, {data.name} \n \n );\n }\n}\n\nexport default Registration;\n","import React from 'react';\nimport styled from 'styled-components';\n\nconst Container = styled.div`\n padding: 0.5rem;\n margin-bottom: 2rem;\n background-color: ${p => p.theme.color.white10};\n`;\n\nconst Row = styled.div`\n display: flex;\n flex-direction: row;\n align-items: center;\n\n @media screen and (max-width: 600px) {\n flex-direction: column;\n align-items: flex-start;\n margin-bottom: 0.5rem;\n\n .propositions {\n width: 100%;\n }\n }\n\n justify-content: space-between;\n padding: 0.2rem 0.5rem;\n border-bottom: 1px dotted ${p => p.theme.color.white100};\n\n div:last-of-type {\n text-align: right;\n }\n`;\n\nconst renderPropositions = (propositions) => {\n if (!propositions) return null;\n return propositions.map((p, index) => (\n \n {p.date}: {p.startTime}–{p.endTime}\n
\n ))\n}\n\nconst Panel = ({ data }) => {\n if (!data) return null;\n console.log(data)\n return (\n \n \n ID
\n { data._id }
\n
\n \n Registered at
\n { data.timestamp }
\n
\n \n Accept
\n { data.accept }
\n
\n \n Name
\n { data.name }
\n
\n \n Description
\n { data.description }
\n
\n \n Team
\n { data.team }
\n
\n \n Responsible
\n { data.responsible }
\n
\n \n Email
\n { data.email }
\n
\n \n Genre/type
\n { data.genre }
\n
\n \n Participants
\n { data.participants }
\n
\n \n Duration
\n { data.duration }
\n
\n \n Info
\n { data.info }
\n
\n \n Producer
\n { data.producer }
\n
\n \n Photoshoot date
\n { data.photoshoot }
\n
\n \n Time propositions
\n { renderPropositions(data.propositions) }
\n
\n \n )\n}\n\nexport default Panel;\n","import React, { Component } from 'react';\nimport axios from 'axios';\nimport Cookie from 'universal-cookie';\nimport AdminNavbar from '../../admin/AdminNavbar';\nimport Registration from '../../admin/Registration';\nimport RegistrationPanel from '../../admin/RegistrationPanel';\nimport { Count, Column, Container, Log } from '../../admin/Styles';\nimport { environment } from '../../../utils';\nimport { errorStatusCodes } from '../../admin/AdminNavbar';\n\nconst cookie = new Cookie();\n\nconst BACKEND_URL = environment.REACT_APP_BACKEND_HTTP_URL;\n\nclass AdminRegistrationsPage extends Component {\n constructor(props) {\n super(props);\n this.state = {\n registrations: [],\n loading: true,\n error: null,\n selected: null,\n logScrolled: false\n };\n this.logRef = React.createRef();\n this.fetchRegistrations();\n }\n\n fetchRegistrations = async () => {\n const { history } = this.props;\n const token = cookie.get('jwt');\n\n try {\n const resp = await axios.get(`${BACKEND_URL}/admin/registrations`, {\n headers: {\n Authorization: token\n }\n });\n const registrations = resp.data;\n this.setState({\n registrations,\n loading: false\n });\n } catch (err) {\n console.error(err);\n if (err.response && errorStatusCodes.includes(err.response.status)) {\n cookie.remove('jwt');\n history.push('/login?next=/admin/registrations');\n return;\n }\n\n this.setState({\n loading: false,\n error: 'Error, check console'\n });\n }\n };\n\n isSelected = (msg, other) => {\n return msg && other && msg._id === other._id;\n };\n\n onSelect = data => {\n console.log(data);\n this.setState({\n selected: data\n });\n };\n\n componentDidUpdate = () => {\n const { logScrolled } = this.state;\n // Scroll to bottom of chat log\n if (this.logRef.current && !logScrolled) {\n this.logRef.current.scrollTop = this.logRef.current.scrollHeight;\n this.setState({\n logScrolled: true\n });\n }\n };\n\n renderRegistrationRows = () => {\n const { registrations, loading, error, selected } = this.state;\n\n if (error) {\n return error;\n }\n\n if (loading) {\n return { rows: 'Loading...' };\n }\n\n if (registrations.length === 0) {\n return { rows: 'No registrations yet.' };\n }\n\n const rows = registrations.map((m, index) => (\n \n Registrations \n {count && Total: {count} registration(s) }\n \n {rows} \n \n \n \n \n );\n }\n}\n\nexport default AdminRegistrationsPage;\n","import React, { Component } from 'react';\nimport styled from 'styled-components';\nimport { LogRow, LogRowContrast } from './Styles';\n\nconst Text = styled.span`\n text-overflow: ellipsis;\n overflow: hidden;\n min-width: 0;\n`;\n\nclass Message extends Component {\n select = () => {\n const { data, onSelect } = this.props;\n onSelect(data, 'message');\n }\n\n render() {\n const { data, selected } = this.props;\n return (\n \n { data.timestamp } \n { data.name }: \n { data.text } \n \n )\n }\n}\n\nexport default Message;","import React, { Component, Fragment } from 'react';\nimport styled from 'styled-components';\nimport ReactModal from 'react-modal';\nimport { removeMessage, banUserForMessage } from '../../utils';\n\nconst Container = styled.div`\n padding: 0.5rem;\n margin-bottom: 2rem;\n min-width: 0;\n background-color: ${(p) => p.theme.color.white10};\n`;\n\nconst Row = styled.div`\n display: flex;\n flex-direction: row;\n align-items: center;\n\n @media screen and (max-width: 400px) {\n flex-direction: column;\n align-items: flex-start;\n margin-bottom: 0.5rem;\n }\n\n justify-content: space-between;\n padding: 0.5rem;\n min-width: 0;\n`;\n\nconst Buttons = styled.div`\n @media screen and (max-width: 400px) {\n width: 100%;\n }\n\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n`;\n\nconst Button = styled.button`\n margin: 0 0.5rem;\n\n @media screen and (max-width: 400px) {\n margin: 0 0;\n }\n\n padding: 1rem;\n border: 0;\n font-size: 1rem;\n`;\n\nconst Actions = styled.div`\n flex: 1;\n`;\n\nconst Modal = styled(ReactModal)`\n width: 500px;\n\n @media screen and (max-width: 600px) {\n width: 90vw;\n }\n\n background-color: ${(p) => p.theme.color.white100};\n\n &,\n * {\n color: ${(p) => p.theme.color.grey100};\n }\n\n margin: auto;\n padding: 1rem;\n margin-top: calc(50vh - 0.5 * 400px);\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n`;\n\nconst ModalContent = styled.div`\n flex: 1;\n margin-bottom: 2rem;\n text-align: center;\n`;\n\nconst ModalButtons = styled.div`\n display: flex;\n flex-direction: row;\n\n button {\n background-color: ${(p) => p.theme.color.boldText};\n }\n`;\n\nconst ModalButton = styled(Button)`\n flex: 1;\n\n @media screen and (max-width: 400px) {\n margin: 0 0.5rem;\n }\n`;\n\nconst Text = styled.span`\n text-overflow: ellipsis;\n overflow: hidden;\n margin-left: 1rem;\n min-width: 0;\n`;\n\nclass Panel extends Component {\n state = {\n showRemoveModal: false,\n showBanModal: false,\n };\n\n ban = async () => {\n const { data, history, refresh } = this.props;\n this.setState({ showBanModal: false });\n try {\n await banUserForMessage(data._id);\n refresh();\n } catch (err) {\n console.log(err);\n if (err.unauthorized) {\n history.push('/login?next=/admin');\n }\n }\n };\n\n remove = async () => {\n const { data, history, refresh } = this.props;\n this.setState({ showRemoveModal: false });\n try {\n await removeMessage(data._id);\n refresh();\n } catch (err) {\n console.log(err);\n if (err.unauthorized) {\n history.push('/login?next=/admin');\n }\n }\n };\n\n renderModal = () => {\n const { data } = this.props;\n const { showRemoveModal, showBanModal } = this.state;\n return (\n \n \n \n Remove message? \n Username: {data.name}\n \n \n Yes \n this.setState({ showRemoveModal: false })}\n >\n No\n \n \n \n \n \n Ban user by IP? \n IP: {data.ip}\n \n \n Yes \n this.setState({ showBanModal: false })}>\n No\n \n \n \n \n );\n };\n\n render() {\n const { data } = this.props;\n\n return data ? (\n \n {this.renderModal()}\n \n Timestamp
\n {data.timestamp}
\n
\n \n ID
\n {data._id}
\n
\n \n Username
\n {data.name}
\n
\n \n Message
\n {data.text} \n
\n \n IP Address
\n {data.ip}
\n
\n \n Actions \n \n this.setState({ showRemoveModal: true })}>\n Remove\n \n this.setState({ showBanModal: true })}>\n Ban by IP\n \n \n
\n \n ) : null;\n }\n}\n\nexport default Panel;\n","import React, { Component, Fragment } from 'react';\nimport axios from 'axios';\nimport Message from '../../admin/Message';\nimport MessagePanel from '../../admin/MessagePanel';\nimport Cookie from 'universal-cookie';\nimport AdminNavbar from '../../admin/AdminNavbar';\nimport { Count, Column, Container, Log } from '../../admin/Styles';\nimport { environment } from '../../../utils';\nimport { errorStatusCodes } from '../../admin/AdminNavbar';\n\nconst cookie = new Cookie();\n\nconst BACKEND_URL = environment.REACT_APP_BACKEND_HTTP_URL;\n\nconst BannedWordsPanel = ({\n words,\n field,\n handleChange,\n handleSubmit,\n handleDelete,\n}) => {\n let wordRows;\n if (words.length === 0) {\n wordRows = [No banned words
];\n } else {\n wordRows = words.map((word, idx) => {\n return (\n \n {word.word} Delete \n \n );\n });\n }\n\n return (\n \n \n \n \n );\n};\n\nclass AdminShoutboxPage extends Component {\n state = {\n messages: [],\n selected: null,\n loading: true,\n logScrolled: false,\n filters: [],\n words: [],\n wordField: '',\n };\n logRef = React.createRef();\n state = {\n ...this.state,\n showBannedMessages: false,\n };\n\n setShowBannedMessages = (value) => {\n this.setState({ showBannedMessages: value });\n };\n\n fetchWords = async () => {\n const { history } = this.props;\n const token = cookie.get('jwt');\n try {\n const res = await axios.get(`${BACKEND_URL}/admin/words`, {\n headers: {\n Authorization: token,\n },\n });\n const words = res.data.words;\n this.setState({\n words,\n loading: false,\n });\n } catch (err) {\n console.error(err);\n if (err.response && errorStatusCodes.includes(err.response.status)) {\n cookie.remove('jwt');\n history.push('/login?next=/admin/shoutbox');\n return;\n }\n\n this.setState({\n loading: false,\n error: 'Error loading words, check console',\n });\n }\n };\n\n fetchFilters = async () => {\n const { history } = this.props;\n const token = cookie.get('jwt');\n try {\n const res = await axios.get(`${BACKEND_URL}/admin/filters`, {\n headers: {\n Authorization: token,\n },\n });\n const filters = res.data.filters;\n this.setState({\n filters,\n loading: false,\n });\n } catch (err) {\n console.error(err);\n if (err.response && errorStatusCodes.includes(err.response.status)) {\n cookie.remove('jwt');\n history.push('/login?next=/admin/shoutbox');\n return;\n }\n\n this.setState({\n loading: false,\n error: 'Error loading filters, check console',\n });\n }\n };\n\n fetchMessages = async () => {\n const { history } = this.props;\n const token = cookie.get('jwt');\n\n try {\n const resp = await axios.get(`${BACKEND_URL}/admin/messages`, {\n headers: {\n Authorization: token,\n },\n });\n const messages = resp.data.messages;\n this.setState({\n messages,\n loading: false,\n });\n } catch (err) {\n console.error(err);\n if (err.response && errorStatusCodes.includes(err.response.status)) {\n cookie.remove('jwt');\n history.push('/login?next=/admin/shoutbox');\n return;\n }\n\n this.setState({\n loading: false,\n error: 'Error loading messages, check console',\n });\n }\n };\n\n componentDidMount() {\n this.refresh();\n }\n\n componentDidUpdate = () => {\n const { logScrolled } = this.state;\n // Scroll to bottom of chat log\n if (this.logRef.current && !logScrolled) {\n this.logRef.current.scrollTop = this.logRef.current.scrollHeight;\n this.setState({\n logScrolled: true,\n });\n }\n };\n\n onSelect = (data, type) => {\n console.log(data);\n this.setState({\n selected: data,\n });\n };\n\n toggleFilter = (filter) => async () => {\n const { history } = this.props;\n const token = cookie.get('jwt');\n const nextState = filter.state ? 'off' : 'on';\n const slug = filter.slug;\n try {\n const res = await axios.post(\n `${BACKEND_URL}/admin/filters/${slug}/${nextState}`,\n null,\n {\n headers: {\n Authorization: token,\n },\n }\n );\n const updatedFilter = res.data;\n this.setState({\n filters: this.state.filters.map((f) =>\n f.slug === updatedFilter.slug ? updatedFilter : f\n ),\n });\n } catch (err) {\n console.error(err);\n if (err.response && errorStatusCodes.includes(err.response.status)) {\n cookie.remove('jwt');\n history.push('/login?next=/admin/shoutbox');\n return;\n }\n\n this.setState({\n loading: false,\n error: 'Error while togling filter, check console',\n });\n }\n };\n\n handleWordDelete = (word) => async () => {\n const { history } = this.props;\n const token = cookie.get('jwt');\n const id = word._id;\n try {\n // eslint-disable-next-line no-unused-vars\n const res = await axios.delete(\n `${BACKEND_URL}/admin/words/remove/${id}`,\n {\n headers: {\n Authorization: token,\n },\n }\n );\n this.setState({\n words: this.state.words.filter((w) => w._id !== id),\n });\n } catch (err) {\n console.error(err);\n if (err.response && errorStatusCodes.includes(err.response.status)) {\n cookie.remove('jwt');\n history.push('/login?next=/admin/shoutbox');\n return;\n }\n\n this.setState({\n loading: false,\n error: 'Error while deleting banned word, check console',\n });\n }\n };\n\n isSelected = (msg, other) => {\n return msg && other && msg._id === other._id;\n };\n\n refresh = () => {\n this.fetchMessages();\n this.fetchFilters();\n this.fetchWords();\n };\n\n wordFieldHandleChange = (event) => {\n this.setState({ wordField: event.target.value });\n };\n\n wordFieldHandleSubmit = async (event) => {\n event.preventDefault();\n const { history } = this.props;\n const token = cookie.get('jwt');\n const word = this.state.wordField;\n try {\n await axios.post(`${BACKEND_URL}/admin/words/${word}`, null, {\n headers: {\n Authorization: token,\n },\n });\n this.fetchWords();\n } catch (err) {\n console.error(err);\n if (err.response && errorStatusCodes.includes(err.response.status)) {\n cookie.remove('jwt');\n history.push('/login?next=/admin/shoutbox');\n return;\n }\n }\n this.setState({ wordField: '' });\n };\n\n renderContent = () => {\n const { messages, filters, selected, loading, words, wordField } =\n this.state;\n const { history } = this.props;\n if (loading) {\n return Loading... ;\n }\n\n let filterRows;\n if (filters.length === 0) {\n filterRows = [No filters available.
];\n } else {\n filterRows = (\n \n {filters.map((filter) => {\n const state = filter.state ? 'ON' : 'OFF';\n const nextState = filter.state ? 'OFF' : 'ON';\n\n return (\n \n {filter.slug} {filter.description}, state:{' '}\n {state} \n \n Turn {nextState}!\n \n \n );\n })}\n \n );\n }\n\n let messageRows, count;\n if (messages.length === 0) {\n messageRows = No shoutbox messages.
;\n } else {\n messageRows = messages.map((m, index) => (\n \n Shoutbox filters \n {filterRows} \n Banned words \n \n this.setShowBannedMessages(!this.state.showBannedMessages)\n }\n >\n {this.state.showBannedMessages ? 'Hide' : 'Expand'}\n \n {this.state.showBannedMessages && (\n \n \n )}\n Shoutbox messages \n {count && Total: {count} shoutbox messages(s) }\n \n {messageRows} \n \n \n \n \n );\n };\n\n render() {\n return (\n \n \n );\n }\n}\n\nexport default AdminShoutboxPage;\n","import React, { Component, Fragment } from 'react';\nimport styled from 'styled-components';\nimport ReactModal from 'react-modal';\nimport { liftBan } from '../../utils';\n\nconst Container = styled.div`\n padding: 0.5rem;\n margin-bottom: 2rem;\n background-color: ${(p) => p.theme.color.white10};\n`;\n\nconst Row = styled.div`\n display: flex;\n flex-direction: row;\n align-items: center;\n\n @media screen and (max-width: 400px) {\n flex-direction: column;\n align-items: flex-start;\n margin-bottom: 0.5rem;\n }\n\n justify-content: space-between;\n padding: 0.5rem;\n`;\n\nconst Button = styled.button`\n @media screen and (max-width: 400px) {\n margin: 0 0;\n }\n\n background-color: ${(p) => p.theme.color.boldText};\n color: ${(p) => p.theme.color.white100};\n padding: 1rem;\n border: none;\n outline: none;\n font-size: 1rem;\n cursor: pointer;\n`;\n\nconst Actions = styled.div`\n flex: 1;\n`;\n\nconst Modal = styled(ReactModal)`\n width: 500px;\n\n @media screen and (max-width: 600px) {\n width: 90vw;\n }\n\n background-color: ${(p) => p.theme.color.white100};\n\n &,\n * {\n color: ${(p) => p.theme.color.grey100};\n }\n\n margin: auto;\n padding: 1rem;\n margin-top: calc(50vh - 0.5 * 400px);\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n`;\n\nconst ModalContent = styled.div`\n flex: 1;\n margin-bottom: 2rem;\n text-align: center;\n`;\n\nconst ModalButtons = styled.div`\n display: flex;\n flex-direction: row;\n\n button {\n margin: 1rem;\n background-color: ${(p) => p.theme.color.boldText};\n }\n`;\n\nconst ModalButton = styled(Button)`\n flex: 1;\n\n @media screen and (max-width: 400px) {\n margin: 0 0.5rem;\n }\n`;\n\nclass Panel extends Component {\n state = {\n showRemoveModal: false,\n };\n\n remove = async () => {\n const { data, history, refresh } = this.props;\n this.setState({ showRemoveModal: false });\n try {\n await liftBan(data.ip);\n refresh();\n } catch (err) {\n console.log(err);\n if (err.unauthorized) {\n history.push('/login?next=/admin');\n }\n }\n };\n\n renderModal = () => {\n const { data } = this.props;\n const { showRemoveModal } = this.state;\n return (\n \n \n \n Lift ban? \n {data.name}, IP: {data.ip}\n \n \n Yes \n this.setState({ showRemoveModal: false })}\n >\n No\n \n \n \n \n );\n };\n\n render() {\n const { data } = this.props;\n\n return data ? (\n \n {this.renderModal()}\n \n Time of ban
\n {data.timeOfBan}
\n
\n \n Time of last message
\n {data.timeOfMessage}
\n
\n \n ID
\n {data._id}
\n
\n \n Username
\n {data.name}
\n
\n \n Last message
\n {data.text}
\n
\n \n IP Address
\n {data.ip}
\n
\n \n Actions \n this.setState({ showRemoveModal: true })}>\n Lift ban\n \n
\n \n ) : null;\n }\n}\n\nexport default Panel;\n","import React, { Component } from 'react';\nimport { LogRow } from './Styles';\n\nclass Ban extends Component {\n render() {\n const { data, onSelect } = this.props;\n return (\n onSelect(data, 'ban')}>\n { data.name }, IP: { data.ip }\n \n );\n }\n}\n\nexport default Ban;","import React, { Component, Fragment } from 'react';\nimport axios from 'axios';\nimport BanPanel from '../../admin/BanPanel';\nimport Ban from '../../admin/Ban';\nimport Cookie from 'universal-cookie';\nimport AdminNavbar from '../../admin/AdminNavbar';\nimport { Count, Column, Container, Log } from '../../admin/Styles';\nimport { environment } from '../../../utils';\nimport { errorStatusCodes } from '../../admin/AdminNavbar';\n\nconst cookie = new Cookie();\n\nconst BACKEND_URL = environment.REACT_APP_BACKEND_HTTP_URL;\n\nclass AdminBansPage extends Component {\n state = {\n bans: [],\n selected: null,\n loading: true,\n logScrolled: false\n };\n logRef = React.createRef();\n\n fetchBans = async () => {\n const { history } = this.props;\n const token = cookie.get('jwt');\n\n try {\n const resp = await axios.get(`${BACKEND_URL}/admin/users/banned`, {\n headers: {\n Authorization: token\n }\n });\n const bans = resp.data.bans;\n this.setState({\n bans,\n loading: false\n });\n } catch (err) {\n console.error(err);\n if (err.response && errorStatusCodes.includes(err.response.status)) {\n cookie.remove('jwt');\n history.push('/login?next=/admin/bans');\n return;\n }\n\n this.setState({\n loading: false,\n error: 'Error, check console'\n });\n }\n };\n\n componentDidMount() {\n this.refresh();\n }\n\n componentDidUpdate = () => {\n const { logScrolled } = this.state;\n // Scroll to bottom of chat log\n if (this.logRef.current && !logScrolled) {\n this.logRef.current.scrollTop = this.logRef.current.scrollHeight;\n this.setState({\n logScrolled: true\n });\n }\n };\n\n onSelect = (data, type) => {\n console.log(data);\n this.setState({\n selected: data\n });\n };\n\n isSelected = (msg, other) => {\n return msg && other && msg._id === other._id;\n };\n\n refresh = () => {\n this.fetchBans();\n };\n\n renderContent = () => {\n const { bans, selected, loading } = this.state;\n const { history } = this.props;\n if (loading) {\n return Loading... ;\n }\n\n let banRows, count;\n if (bans.length === 0) {\n banRows = No bans.
;\n } else {\n banRows = bans.map((m, index) => (\n \n {count && Total: {count} ban(s) }\n \n {banRows} \n \n \n \n \n );\n };\n\n render() {\n return (\n \n Bans \n {this.renderContent()}\n \n );\n }\n}\n\nexport default AdminBansPage;\n","import React, { Component } from 'react';\nimport { LogRow } from './Styles';\n\nclass ReservedName extends Component {\n render() {\n const { data, onSelect } = this.props;\n return (\n onSelect(data, 'reserved')}>\n { data.name }, IP: { data.ip }\n \n );\n }\n}\n\nexport default ReservedName;","import React, { Component } from 'react';\nimport styled from 'styled-components';\n\nconst Container = styled.div`\n padding: 0.5rem;\n margin-bottom: 2rem;\n background-color: ${p => p.theme.color.white10};\n`;\n\nconst Row = styled.div`\n display: flex;\n flex-direction: row;\n align-items: center;\n\n @media screen and (max-width: 400px) {\n flex-direction: column;\n align-items: flex-start;\n margin-bottom: 0.5rem;\n }\n\n justify-content: space-between;\n padding: 0.5rem;\n`;\n\nclass Panel extends Component {\n\n render() {\n const { data } = this.props;\n\n return data ? (\n \n \n ID
\n { data._id }
\n
\n \n Username
\n { data.name }
\n
\n \n IP Address
\n { data.ip }
\n
\n \n ) : null;\n }\n}\n\nexport default Panel;","import React, { Component, Fragment } from 'react';\nimport axios from 'axios';\nimport ReservedName from '../../admin/ReservedName';\nimport ReservedNamePanel from '../../admin/ReservedNamePanel';\nimport Cookie from 'universal-cookie';\nimport AdminNavbar from '../../admin/AdminNavbar';\nimport { Count, Column, Container, Log } from '../../admin/Styles';\nimport { environment } from '../../../utils';\nimport { errorStatusCodes } from '../../admin/AdminNavbar';\n\nconst cookie = new Cookie();\n\nconst BACKEND_URL = environment.REACT_APP_BACKEND_HTTP_URL;\n\nclass AdminReservedPage extends Component {\n state = {\n reservedNames: [],\n selected: null,\n loading: true,\n logScrolled: false\n };\n logRef = React.createRef();\n\n fetchReservedUsers = async () => {\n const { history } = this.props;\n const token = cookie.get('jwt');\n\n try {\n const resp = await axios.get(`${BACKEND_URL}/admin/users/reserved`, {\n headers: {\n Authorization: token\n }\n });\n const reservedNames = resp.data.reserved;\n this.setState({\n reservedNames,\n loading: false\n });\n } catch (err) {\n console.error(err);\n if (err.response && errorStatusCodes.includes(err.response.status)) {\n cookie.remove('jwt');\n history.push('/login?next=/admin/reserved_users');\n return;\n }\n\n this.setState({\n loading: false,\n error: 'Error, check console'\n });\n }\n };\n\n componentDidMount() {\n this.refresh();\n }\n\n componentDidUpdate = () => {\n const { logScrolled } = this.state;\n // Scroll to bottom of chat log\n if (this.logRef.current && !logScrolled) {\n this.logRef.current.scrollTop = this.logRef.current.scrollHeight;\n this.setState({\n logScrolled: true\n });\n }\n };\n\n onSelect = (data, type) => {\n console.log(data);\n this.setState({\n selected: data\n });\n };\n\n isSelected = (msg, other) => {\n return msg && other && msg._id === other._id;\n };\n\n refresh = () => {\n this.fetchReservedUsers();\n };\n\n renderContent = () => {\n const { reservedNames, selected, loading } = this.state;\n const { history } = this.props;\n\n if (loading) {\n return Loading... ;\n }\n\n let reservedNameRows, count;\n if (reservedNames.length === 0) {\n reservedNameRows = No reserved names.
;\n } else {\n reservedNameRows = reservedNames.map((m, index) => (\n \n {count && Total: {count} reserved name(s) }\n \n {reservedNameRows} \n \n \n \n \n );\n };\n\n render() {\n return (\n \n Reserved users \n {this.renderContent()}\n \n );\n }\n}\n\nexport default AdminReservedPage;\n","import React, { Component } from 'react';\nimport { LogRow } from './Styles';\n\nclass Recruitment extends Component {\n render() {\n const { data, onSelect } = this.props;\n return (\n onSelect(data, 'recruitment')}>\n { data.name }\n \n );\n }\n}\n\nexport default Recruitment;","import React, { Component } from 'react';\nimport styled from 'styled-components';\n\nconst Container = styled.div`\n padding: 0.5rem;\n margin-bottom: 2rem;\n background-color: ${p => p.theme.color.white10};\n`;\n\nconst Row = styled.div`\n display: flex;\n flex-direction: row;\n align-items: center;\n\n @media screen and (max-width: 400px) {\n flex-direction: column;\n align-items: flex-start;\n margin-bottom: 0.5rem;\n }\n\n justify-content: space-between;\n padding: 0.5rem;\n`;\n\nclass Panel extends Component {\n\n render() {\n const { data } = this.props;\n\n return data ? (\n \n \n ID
\n { data._id }
\n
\n \n Timestamp
\n { data.timestamp }
\n
\n \n Name
\n { data.name }
\n
\n \n Email
\n { data.email }
\n
\n \n Roles
\n {data.roles && data.roles.join(', ')}
\n
\n \n Application:
\n
\n \n {data.message.split('\\n').map((item, key) => {\n return {item} \n })}
\n
\n\n \n ) : null;\n }\n}\n\nexport default Panel;","import React, { Component, Fragment } from 'react';\nimport axios from 'axios';\nimport Recruitment from '../../admin/Recruitment';\nimport RecruitmentPanel from '../../admin/RecruitmentPanel';\nimport Cookie from 'universal-cookie';\nimport AdminNavbar from '../../admin/AdminNavbar';\nimport { Count, Column, Container, Log } from '../../admin/Styles';\nimport { environment } from '../../../utils';\nimport { errorStatusCodes } from '../../admin/AdminNavbar';\n\nconst cookie = new Cookie();\n\nconst BACKEND_URL = environment.REACT_APP_BACKEND_HTTP_URL;\n\nclass AdminRecruitmentPage extends Component {\n state = {\n recruitments: [],\n selected: null,\n loading: true,\n logScrolled: false\n };\n logRef = React.createRef();\n\n fetchRecruitment = async () => {\n const { history } = this.props;\n const token = cookie.get('jwt');\n\n try {\n const resp = await axios.get(`${BACKEND_URL}/admin/recruitment`, {\n headers: {\n Authorization: token\n }\n });\n const recruitment = resp.data;\n this.setState({\n recruitments: recruitment,\n loading: false\n });\n } catch (err) {\n console.error(err);\n if (err.response && errorStatusCodes.includes(err.response.status)) {\n cookie.remove('jwt');\n history.push('/login?next=/admin/recruitment');\n return;\n }\n\n this.setState({\n loading: false,\n error: 'Error, check console'\n });\n }\n };\n\n componentDidMount() {\n this.refresh();\n }\n\n componentDidUpdate = () => {\n const { logScrolled } = this.state;\n // Scroll to bottom of chat log\n if (this.logRef.current && !logScrolled) {\n this.logRef.current.scrollTop = this.logRef.current.scrollHeight;\n this.setState({\n logScrolled: true\n });\n }\n };\n\n onSelect = (data, type) => {\n console.log(data);\n this.setState({\n selected: data\n });\n };\n\n isSelected = (msg, other) => {\n return msg && other && msg._id === other._id;\n };\n\n refresh = () => {\n this.fetchRecruitment();\n };\n\n renderContent = () => {\n const { recruitments, selected, loading } = this.state;\n const { history } = this.props;\n\n if (loading) {\n return Loading... ;\n }\n\n let recruitmentRows, count;\n if (recruitments.length === 0) {\n recruitmentRows = No applications.
;\n } else {\n recruitmentRows = recruitments.map((m, index) => (\n \n {count && Total: {count} application(s) }\n \n {recruitmentRows} \n \n \n \n \n );\n };\n\n render() {\n return (\n \n Recruitment \n {this.renderContent()}\n \n );\n }\n}\n\nexport default AdminRecruitmentPage;\n","import React, { useState, useEffect, createContext } from 'react';\nimport { environment } from '../../utils';\n\nconst WS_URL = environment.REACT_APP_BACKEND_WS_URL;\n\nexport const SocketContext = createContext(null);\n\nconst SocketProvider = ({ children }) => {\n const [connection, setConnection] = useState(() => new WebSocket(WS_URL));\n\n const reconnect = () => {\n console.log(\"Reconnecting WebSocket...\");\n setConnection(new WebSocket(WS_URL));\n };\n\n useEffect(() => {\n connection.onopen = () => {\n console.log('WebSocket connection established');\n }\n connection.onerror = (evt) => {\n console.log(`WebSocket error. Data: ${evt.data}`);\n }\n connection.onclose = () => setTimeout(reconnect, 1000);\n return () => { connection.close(); };\n }, [connection]);\n\n return (\n \n {children}\n \n );\n};\n\nexport default SocketProvider;\n","import React, { useState, createContext } from 'react';\n\nexport const ChatContext = createContext(null);\n\nconst ChatProvider = ({ children }) => {\n const [chatLog, setChatLog] = useState([]);\n\n return (\n \n {children}\n \n );\n};\n\nexport default ChatProvider;\n","import React, { useRef, useEffect, useCallback, useContext } from 'react';\nimport styled from 'styled-components';\nimport Cookie from 'universal-cookie';\nimport dateFormat from 'dateformat';\nimport { SocketContext } from './SocketProvider';\nimport { ChatContext } from './ChatProvider';\n\nimport verified from '../../svg/check-mark.svg';\n\nconst MAX_MESSAGES = 100;\nconst MESSAGE_MAX_LENGTH = 500;\nconst USERNAME_MAX_LENGTH = 16;\n\nconst cookie = new Cookie();\n\nconst Container = styled.div`\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 1rem;\n max-height: calc(100vh - 2rem);\n background-color: ${(p) => p.theme.color.white10};\n`;\n\nconst Log = styled.div`\n width: 100%;\n flex: 1;\n overflow: auto;\n font-size: 0.8rem;\n line-height: 1.1rem;\n\n scrollbar-color: #aaa #0000;\n scrollbar-width: thin;\n\n &::-webkit-scrollbar {\n width: 0.5rem;\n }\n\n &::-webkit-scrollbar-track {\n opacity: 0;\n }\n\n &::-webkit-scrollbar-thumb {\n background: #888;\n }\n\n &::-webkit-scrollbar-thumb:hover {\n background: #aaa;\n }\n`;\n\nconst Row = styled.div`\n padding: 0.3rem;\n font-size: 1rem;\n ${(p) => p.error && `color: ${(p) => p.theme.color.turquoise100}`};\n display: flex;\n align-items: flex-start;\n`;\n\nconst InputContainer = styled.div`\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n`;\n\nconst SendButton = styled.a`\n padding: 0.5rem;\n margin: 0.5rem;\n cursor: pointer;\n background-color: ${(p) => p.theme.color.white100};\n color: ${(p) => p.theme.color.grey100};\n\n &:hover {\n text-decoration: none;\n background-color: ${(p) => p.theme.color.boldText};\n color: ${(p) => p.theme.color.white100};\n }\n`;\n\nconst Username = styled.input`\n padding: 0.5rem;\n margin: 0.5rem;\n flex: 1;\n`;\n\nconst InputRow = styled.div`\n flex: 4;\n display: flex;\n`;\n\nconst Prompt = styled.input`\n flex: 1;\n padding: 0.5rem;\n margin: 0.5rem;\n`;\n\nconst Verified = styled.img`\n width: 16px;\n margin: 0 0.3rem 0 0;\n filter: invert(1);\n`;\n\nconst Timestamp = styled.div`\n white-space: nowrap;\n margin-right: 0.3rem;\n display: flex;\n justify-content: space-between;\n font-size: 0.8rem;\n font-weight: bold;\n opacity: 0.8;\n`;\n\nconst RowText = styled.span`\n word-break: break-word;\n`;\n\nconst RowUser = styled.span`\n white-space: pre;\n font-weight: bold;\n color: ${(p) => p.theme.color.boldText};\n\n &::after {\n content: ': ';\n color: ${(p) => p.theme.color.white100};\n }\n`;\n\nconst Block = styled.span`\n display: block;\n word-break: break-all;\n`;\n\nconst Shoutbox = () => {\n const connection = useContext(SocketContext);\n const logContext = useContext(ChatContext);\n const cookieRef = useRef(null);\n const chatLogRef = useRef(null);\n const usernameRef = useRef(null);\n const msgRef = useRef(null);\n\n const showError = useCallback(\n (evt) => {\n logContext.setLog([\n {\n error: true,\n name: 'SERVER',\n text: 'Huutislaatikko ei saa yhteyttä! :(',\n timestamp: new Date(),\n },\n ]);\n },\n [logContext]\n );\n\n const handleData = useCallback(\n (evt) => {\n const data = JSON.parse(evt.data);\n\n // Hack to get the current state of the log with the setter function\n let currentLog;\n logContext.setLog((current) => {\n currentLog = current;\n return current;\n });\n\n if (data.initial) {\n logContext.setLog(data.initial);\n } else if (data.message) {\n const newLog = currentLog.concat([data.message]);\n if (newLog.length > MAX_MESSAGES) {\n newLog.splice(0, 1);\n }\n logContext.setLog(newLog);\n } else if (data.erase) {\n const id = data.erase;\n const filtered = currentLog.filter((m) => m._id !== id);\n logContext.setLog(filtered);\n }\n },\n [logContext]\n );\n\n const sendMessage = () => {\n const text = msgRef.current.value,\n username = usernameRef.current.value;\n\n const authorization = cookie.get('jwt');\n if (!username || username.length === 0) {\n alert('A username is required!');\n return;\n }\n\n if (!text || text.length === 0) {\n alert('A message is required!');\n return;\n }\n\n if (text.length > MESSAGE_MAX_LENGTH) {\n alert(`Message too long! Max: ${MESSAGE_MAX_LENGTH} characters.`);\n return;\n }\n\n if (username.length > USERNAME_MAX_LENGTH) {\n alert(`Username too long! Max: ${USERNAME_MAX_LENGTH} characters.`);\n return;\n }\n\n console.log(`Send message: ${text}, username: ${username}`);\n connection.send(\n JSON.stringify({\n name: username,\n text,\n authorization,\n })\n );\n\n msgRef.current.value = '';\n };\n\n const setUsername = () => {\n const username = usernameRef.current.value;\n cookieRef.current.set('username', username);\n };\n\n const renderRows = (rows) => {\n // Filter out messages from before 2025\n rows = rows.filter(\n (row) =>\n new Date(Date.parse(row.timestamp)) >= new Date('2025-04-01T00:00:00Z')\n );\n return rows.map((row, index) => (\n \n \n \n {dateFormat(new Date(Date.parse(row.timestamp)), 'dd.mm HH:MM')}\n \n \n \n {row.reserved && {row.name} \n {row.text} \n \n
\n ));\n };\n\n useEffect(() => {\n connection.addEventListener('message', handleData);\n connection.addEventListener('error', showError);\n\n return () => {\n connection.removeEventListener('message', handleData);\n connection.removeEventListener('error', showError);\n };\n }, [connection, handleData, showError]);\n\n useEffect(() => {\n cookieRef.current = new Cookie();\n const username = cookieRef.current.get('username') || '';\n usernameRef.current.value = username;\n }, []);\n\n useEffect(() => {\n chatLogRef.current.scrollTop = chatLogRef.current.scrollHeight;\n });\n\n const onPromptKeyPress = (event) => {\n const ENTER_KEY = 13;\n\n if ([event.keyCode, event.which].includes(ENTER_KEY)) {\n sendMessage();\n }\n };\n\n console.log(logContext.log);\n\n return (\n \n {renderRows(logContext.log)} \n\n \n \n {'>'} \n \n \n \n );\n};\n\nexport default Shoutbox;\n","import React from 'react';\nimport styled from 'styled-components';\n//import placeholderImg from '../../images/placeholder_dark.svg'\nimport dateFormat from 'dateformat';\nimport { environment } from '../../utils';\n\nconst ProgramBlock = styled.div`\n font-size: 24px;\n\n padding: 1.5rem;\n min-height: ${(p) => (p.maintainance ? 'none' : '150px')};\n\n &::after {\n content: '';\n clear: both;\n display: table;\n }\n\n background-color: ${(p) => p.theme.color.containerBg};\n margin-bottom: 1em;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n`;\n\nconst Column = styled.div`\n flex: ${(p) => p.flex};\n /* display: flex; */\n flex-direction: column;\n`;\n\nconst Image = styled.img`\n height: 220px;\n width: 220px;\n background-size: cover;\n margin-right: 1.5rem;\n`;\n\nconst Time = styled.span`\n font-size: 1em;\n`;\n\nconst Title = styled.h4`\n margin: 0.5em 0;\n font-size: 1.3em;\n border-bottom: 1px solid ${(p) => p.theme.color.boldText};\n word-wrap: break-word;\n`;\n\nconst Genre = styled.span`\n margin-top: -4px;\n color: ${(p) => p.theme.color.boldText};\n letter-spacing: 0.04em;\n font-size: 0.9em;\n`;\n\nconst Author = styled.span`\n display: inline-block;\n margin: 0.5rem 0;\n font-weight: 500;\n font-size: 0.8em;\n`;\n\nconst Paragraph = styled.p`\n font-size: 1em;\n line-height: 1.4;\n margin: 0.5em 0;\n`;\n\nconst PlaceholderImage = ({ alt }) => (\n \n \n );\n};\n\nconst InfoScreenProgram = ({ p, oneDayPreview }) => {\n const maintainance = p.title === 'HUOLTOTAUKO';\n const img =\n p.image && p.image.trim() ? (\n \n {img} \n \n {`${startDate} - ${endDate}`} \n \n {p.title} - <Author>{p.team}</Author>\n \n {p.description && {p.description} }\n {p.genre} \n \n \n );\n};\n\nexport default InfoScreenProgram;\n","import React, { useEffect, useMemo, useState } from 'react';\nimport styled from 'styled-components';\nimport { environment } from '../../utils';\nimport InfoScreenProgram from './InfoScreenProgram';\n\nconst { \n REACT_APP_BACKEND_HTTP_URL,\n REACT_APP_START_DATE,\n REACT_APP_END_DATE\n} = environment;\n\n\nconst Title = styled.h1`\n display: flex;\n justify-content: space-between;\n font-size: 2rem;\n margin: 0 0 2rem;\n`;\n\nconst startDate = new Date(REACT_APP_START_DATE)\nconst endDate = new Date(REACT_APP_END_DATE)\n\nconst preloadImages = (images) => {\n images.forEach((src) => {\n const img = document.createElement('img');\n img.src = src; // Assigning the img src immediately requests the image\n });\n}\n\nconst InfoScreenCalendar = ({ count = 5 }) => {\n const [all, setAll] = useState();\n const [now, setNow] = useState(Date.now());\n\n useEffect(() => {\n const timer = setInterval(() => setNow(Date.now()), 60000);\n return () => clearInterval(timer);\n }, []);\n\n useEffect((() => {\n if (Date.parse(REACT_APP_START_DATE) && Date.parse(REACT_APP_END_DATE)) {\n const fetchProgrammes = async () => {\n try {\n const resp = await fetch(`${REACT_APP_BACKEND_HTTP_URL}/programmes`)\n const data = await resp.json();\n if (!data || !Array.isArray(data)) {\n console.error('Programme data invalid. Data: ', data);\n return;\n }\n\n data.forEach(program => {\n program.start = new Date(program.start);\n program.end = new Date(program.end);\n\n // Hotfix for removing html from descriptions\n if (//.test(`${program.image}${program.description}${program.team}${program.genre}`)) {\n function removeHtml(text) {\n const div = document.createElement(\"div\");\n div.innerHTML = text;\n return div.textContent.trim();\n }\n if (program.image) program.image = removeHtml(program.image);\n if (program.description) program.description = removeHtml(program.description);\n if (program.team) program.team = removeHtml(program.team);\n if (program.genre) program.genre = removeHtml(program.genre);\n }\n })\n\n const images = data.map(p => p.image || '');\n preloadImages(images);\n\n const filtered = data.filter(p => p.start >= startDate && p.end <= endDate)\n const sorted = filtered.sort((x, y) => + x.start - y.start);\n setAll(sorted);\n } catch (error) {\n console.error(error);\n }\n }\n fetchProgrammes();\n }\n }), []);\n\n const upcoming = useMemo(\n () => all && all.filter(p => p.end > now).slice(0, count),\n [all, now, count],\n );\n\n if (!all) return null;\n\n const content = upcoming && upcoming.map(p => \n
\n <div>Tulevia radio-ohjelmia</div>\n <div>Upcoming programmes</div>\n \n {content}\n \n )\n}\n\nexport default InfoScreenCalendar\n","import React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\n\nimport InfoScreenCalendar from '../../calendar/InfoScreenCalendar';\nimport { HeaderLogo } from '../../common/Header';\nimport Countdown from '../../common/Countdown';\n\nconst CountdownContainer = styled.div`\n margin-bottom: 4rem;\n`;\n\nconst CountdownTitle = styled.h1`\n display: flex;\n justify-content: space-between;\n font-size: 2rem;\n margin: 0 0 2rem;\n`;\n\nconst countdownTo = new Date('2025-04-12T12:00:00+03:00');\n\nconst InfoScreen = () => {\n const [showCountdown, setShowCountdown] = useState(Date.now() < countdownTo);\n\n useEffect(() => {\n const timer = setInterval(() => setShowCountdown(Date.now() < countdownTo), 5000);\n return () => clearInterval(timer);\n }, []);\n\n useEffect(() => {\n const timer = setTimeout(() => window.location.reload(), 300e3);\n return () => clearTimeout(timer);\n }, []);\n\n return (\n <>\n \n \n Lähetyskauden alkuun:
\n Broadcast will start in:
\n \n \n )}\n \n {/* {t('rekry.title')} \n {t('rekry.paragraph1')}
\n {t('rekry.paragraph2')}
\n \n , ]} />\n
*/}\n\n {/* Hae tuottajaksi Radiodiodiin! \n \n Lorem ipsum dolor sit amet joo salee tarvitaan tuottajia\n
\n \n Tähän lörinää siitä mitä tuottaja tekee\n
*/}\n \n {t('rekry.closed')} \n {/* \n );\n}\n\nexport default Recruitment;\n","import React, { Component } from 'react';\nimport styled from 'styled-components';\n\nimport { parseSearch } from '../../../utils';\nimport i18next from '../../../i18n';\nimport { withTranslation } from 'react-i18next';\n\nconst Container = styled.div`\n margin-bottom: 2rem;\n`;\n\nconst Paragraph = styled.div`\n max-width: 700px;\n margin-bottom: 1rem;\n flex-grow: 1;\n\n hr {\n width: 50%;\n text-align: left;\n }\n`;\n\nconst Title = styled.h3`\n margin: 0;\n height: 4rem;\n`;\n\nclass RecruitmentSuccess extends Component {\n render() {\n const { location } = this.props;\n const { search } = location;\n const queryParams = parseSearch(search);\n const { email } = queryParams;\n const t = i18next.t;\n\n return (\n \n \n {t('signup.success.title')} \n \n {t('rekry.success.description')}\n \n { email && (\n \n {t('rekry.success.email')} { email }.\n \n )}\n \n \n );\n }\n}\n\nexport default withTranslation()(RecruitmentSuccess);\n","import React, { Component } from 'react';\nimport styled from 'styled-components';\nimport i18next from '../../../i18n';\nimport { Trans, withTranslation } from 'react-i18next';\n\nconst Container = styled.div`\n margin-bottom: 2rem;\n`;\n\nconst Paragraph = styled.div`\n max-width: 700px;\n flex-grow: 1;\n\n hr {\n width: 50%;\n text-align: left;\n }\n`;\n\nconst Title = styled.h3`\n margin: 0;\n height: 4rem;\n`;\n\nclass RecruitmentError extends Component {\n render() {\n const t = i18next.t;\n return (\n \n \n {t('rekry.error.title')} \n \n ]} />\n \n \n \n );\n }\n}\n\nexport default withTranslation()(RecruitmentError);\n","import React, { useEffect } from 'react';\nimport {\n BrowserRouter as Router,\n Route,\n Switch,\n Redirect,\n useParams,\n useLocation,\n} from 'react-router-dom';\nimport Header from '../common/Header';\nimport Footer from '../common/Footer';\nimport Background from '../common/Background';\nimport Frontpage from '../pages/frontpage/Frontpage';\nimport Companies from '../pages/sponsors/Companies';\nimport Registration from '../pages/registration/Registration';\nimport Library from '../pages/library/Library';\nimport Login from '../pages/admin/Login';\nimport Guide from '../pages/guide/Guide';\n// import English from '../pages/english/English';\nimport CalendarCallback from '../pages/calendar-callback/CalendarCallback';\nimport RegistrationSuccess from '../pages/registration/Success';\nimport RegistrationError from '../pages/registration/Error';\nimport AdminRegistrationsPage from '../pages/admin/AdminRegistrationsPage';\nimport AdminShoutboxPage from '../pages/admin/AdminShoutboxPage';\nimport AdminBansPage from '../pages/admin/AdminBansPage';\nimport AdminReservedPage from '../pages/admin/AdminReservedPage';\nimport AdminRecruitmentPage from '../pages/admin/AdminRecruitmentPage';\n// import Player from '../common/Player';\nimport Shoutbox from '../common/Shoutbox';\nimport ChatProvider from '../common/ChatProvider';\nimport InfoScreen from '../pages/infoscreen/InfoScreen';\nimport Recruitment from '../pages/recruitment/Recruitment';\nimport RecruitmentSuccess from '../pages/recruitment/Success';\nimport RecruitmentError from '../pages/recruitment/Error';\nimport { useTranslation } from 'react-i18next';\n\nconst LanguageSwitcher = () => {\n const { i18n } = useTranslation();\n const { lang } = useParams();\n const location = useLocation();\n const defaultLanguage = 'fi';\n\n useEffect(() => {\n if (location.pathname === '/register') {\n i18n.changeLanguage('en');\n } else if (lang === undefined || !['fi', 'en'].includes(lang)) {\n i18n.changeLanguage(defaultLanguage);\n } else {\n i18n.changeLanguage(lang);\n }\n }, [lang, i18n, defaultLanguage]);\n\n return null;\n};\n\nexport default () => {\n return (\n \n \n \n \n \n 404 } />\n \n \n \n \n \n \n );\n};\n","import { createGlobalStyle } from 'styled-components';\n\nexport const theme = {\n color: {\n bgBlue: '#1A1830',\n bgDark: 'rgba(33, 33, 33, 1)',\n grey100: 'rgba(30, 29, 50, 1)',\n white100: 'rgba(255, 255, 255, 1.0)',\n white70: 'rgba(255, 255, 255, 0.7)',\n white30: 'rgba(255, 255, 255, 0.3)',\n white10: 'rgba(255, 255, 255, 0.10)',\n\n // 2025 colors\n bgLight: '#DCF6DC', // Changed\n containerBg: '#FEFFEE', // Changed\n blueDark: '#720078', // Changed\n blueLight: '#ff00ff',\n boldText: '#275328', // Changed\n redMedium: '#258a27', // Changed\n errorRed: '#ff0000',\n highlightCol: 'rgba(220, 246, 220, 1)', // Changed\n bodyText: '#275328', // Changed\n // firstBoxBg: 'rgba(131, 165, 242, .31)',\n // firstBoxText: '#ff00ff',\n countdownBg: '#bbf2bb',\n linkColor: '#008E04', // Changed\n // linkColorHover: '#FF9C94',\n headingColor: '#275328', // Changed\n headerLinkColor: '#275328', // Changed\n // englishLinkColor: '#275328', //Changed\n galleryHoverBg: '#720078',\n galleryHoverText: 'white',\n\n // make sure we can see unused colors\n orange100: 'lime',\n orangedark100: 'lime',\n turquoise100: 'lime',\n pink100: 'lime',\n darkpink100: 'lime',\n bgGreen: 'lime',\n lightOrange: 'lime',\n realOrange: 'lime',\n darkOrange: 'lime',\n white2: 'lime',\n },\n font: {\n heading: 'Montserrat, sans-serif', // Similar to Avenir, serif headings.\n body: 'Montserrat, sans-serif', // Similar to Avenir, body text.\n },\n};\n\nexport const GlobalStyle = createGlobalStyle`\n body {\n font-family: ${theme.font.body};\n font-weight: 500;\n letter-spacing: 0.5px;\n max-width: 1000px;\n margin: 0 auto 0;\n padding: 1rem;\n line-height: 1.5rem;\n overflow-x: hidden;\n position: relative;\n }\n\n html {\n box-sizing: border-box;\n background-color: ${theme.color.bgLight};\n color: ${theme.color.bodyText};\n }\n\n *,\n *::before,\n *::after {\n box-sizing: inherit;\n }\n\n h1,\n h2 {\n line-height: 2rem;\n font-size: 1.5rem;\n font-family: ${theme.font.heading};\n font-weight: bolder;\n color: ${theme.color.headingColor};\n display: flex;\n margin: 0;\n padding: 1.5rem 0 0;\n }\n\n h3 {\n font-size: 1.5rem;\n color: ${theme.color.headingColor};\n }\n\n a {\n color: ${theme.color.linkColor};\n text-decoration: none;\n cursor: pointer;\n\n &:hover {\n text-decoration: underline;\n }\n }\n\n strong {\n font-weight: 700;\n }\n`;\n\nexport default GlobalStyle;\n","import React, { Component, Suspense } from 'react';\n\nimport Routes from './routes/Routes';\nimport SocketProvider from './common/SocketProvider';\nimport { ThemeProvider } from 'styled-components';\nimport { GlobalStyle, theme } from '../theme';\n// import { environment } from '../utils';\n\n// console.log('environment:', environment);\n\nclass App extends Component {\n render() {\n return (\n }>\n \n \n \n \n \n );\n }\n}\n\nexport default App;\n","import React from 'react';\nimport { hydrate, render } from 'react-dom';\nimport App from './components/App';\nimport './i18n';\n\nconst rootElement = document.getElementById('root');\nif (rootElement.hasChildNodes()) {\n hydrate(