TTMK/web2.0-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' into 'production'

Browse Source 
Production deploy: Update packages, improved Docker images & style fixes

See merge request sahkoinsinoorikilta/vtmk/web2.0-frontend!64
This commit is contained in:
Aarni Halinen
2021-05-15 15:41:48 +00:00
parent fc4b327e4b cc01989b2a
commit 2b16776ee3
29 changed files with 3195 additions and 3414 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.babelrc
+11 -11
View File
@@ -1,16 +1,16 @@
{ {
"presets": [ "presets": [
"next/babel" "next/babel"
], ],
"plugins": [ "plugins": [
[ [
"babel-plugin-styled-components", "babel-plugin-styled-components",
{ {
"ssr": true, "ssr": true,
"displayName": true, "displayName": true,
"preprocess": false, "preprocess": false,
"pure": true "pure": true
} }
] ]
] ]
} }
.dockerignore
+8 -4
View File
@@ -1,7 +1,13 @@
Dockerfile
Dockerfile.prod
.dockerignore
node_modules
npm-debug.log
README*
LICENSE
.next .next
.vscode .vscode
e2e-screenshots e2e-screenshots
node_modules
tests tests
.env* .env*
.eslintrc.json .eslintrc.json
@@ -10,6 +16,4 @@ tests
.gitlab-ci.yml .gitlab-ci.yml
.nvmrc .nvmrc
.stylelintrc .stylelintrc
LICENSE stack-compose*
README*
stack-compose*
.eslintrc.json
+58 -58
View File
@@ -1,61 +1,61 @@
{ {
"root": true, "root": true,
"env": { "env": {
"browser": true, "browser": true,
"commonjs": true, "commonjs": true,
"es6": true, "es6": true,
"node": true "node": true
},
"extends": [
"eslint:recommended",
"plugin:react/recommended",
"plugin:import/errors",
"plugin:import/warnings",
"plugin:jsx-a11y/recommended",
"plugin:react-hooks/recommended",
"plugin:@typescript-eslint/recommended",
"airbnb-typescript"
],
"globals": {
"Atomics": "readonly",
"SharedArrayBuffer": "readonly"
},
"parser": "@typescript-eslint/parser",
"parserOptions": {
"ecmaFeatures": {
"jsx": true
}, },
"extends": [ "ecmaVersion": 2018,
"eslint:recommended", "sourceType": "module",
"plugin:react/recommended", "project": "./tsconfig.json"
"plugin:import/errors", },
"plugin:import/warnings", "plugins": [],
"plugin:jsx-a11y/recommended", "settings": {
"plugin:react-hooks/recommended", "react": {
"plugin:@typescript-eslint/recommended", "version": "detect"
"airbnb-typescript"
],
"globals": {
"Atomics": "readonly",
"SharedArrayBuffer": "readonly"
},
"parser": "@typescript-eslint/parser",
"parserOptions": {
"ecmaFeatures": {
"jsx": true
},
"ecmaVersion": 2018,
"sourceType": "module",
"project": "./tsconfig.json"
},
"plugins": [],
"settings": {
"react": {
"version": "detect"
}
},
"rules": {
"@typescript-eslint/naming-convention": "off",
"max-len": [
"warn",
240
],
"@typescript-eslint/quotes": [
"error",
"double"
],
"import/prefer-default-export": "warn",
"react/jsx-props-no-spreading": "off",
"react/prop-types": "off",
// Temp
"react/jsx-one-expression-per-line": "off",
"react/no-array-index-key": "off",
"@typescript-eslint/explicit-function-return-type": "off",
"@typescript-eslint/explicit-module-boundary-types": "off",
"jsx-a11y/label-has-associated-control": "off",
"jsx-a11y/click-events-have-key-events": "off",
"jsx-a11y/no-noninteractive-element-interactions": "off",
"jsx-a11y/no-static-element-interactions": "off"
} }
} },
"rules": {
"@typescript-eslint/naming-convention": "off",
"max-len": [
"warn",
240
],
"@typescript-eslint/quotes": [
"error",
"double"
],
"import/prefer-default-export": "warn",
"react/jsx-props-no-spreading": "off",
"react/prop-types": "off",
// Temp
"react/jsx-one-expression-per-line": "off",
"react/no-array-index-key": "off",
"@typescript-eslint/explicit-function-return-type": "off",
"@typescript-eslint/explicit-module-boundary-types": "off",
"jsx-a11y/label-has-associated-control": "off",
"jsx-a11y/click-events-have-key-events": "off",
"jsx-a11y/no-noninteractive-element-interactions": "off",
"jsx-a11y/no-static-element-interactions": "off"
}
}
.gitlab-ci.yml
+120 -120
View File
@@ -1,42 +1,42 @@
stages: stages:
- setup - setup
- audit - audit
- lint - lint
- build - build
- test - test
- publish - publish
- deploy - deploy
install: install:
image: node:14 image: node:14
stage: setup stage: setup
script: script:
- npm ci - npm ci
artifacts: artifacts:
paths: paths:
- node_modules - node_modules
expire_in: 1 week expire_in: 1 week
audit: audit:
image: node:14 image: node:14
needs: ["install"] needs: ["install"]
stage: audit stage: audit
script: script:
- npm audit --audit-level=critical - npm audit --audit-level=critical
es:lint: es:lint:
image: node:14 image: node:14
needs: ["install"] needs: ["install"]
stage: lint stage: lint
script: script:
- npm run lint:es - npm run lint:es
css:lint: css:lint:
image: node:14 image: node:14
needs: ["install"] needs: ["install"]
stage: lint stage: lint
script: script:
- npm run lint:css - npm run lint:css
# test:unit: # test:unit:
# image: node:14 # image: node:14
@@ -45,103 +45,103 @@ css:lint:
# - npm run test:unit # - npm run test:unit
build: build:
image: node:14 image: node:14
needs: ["install"] needs: ["install"]
stage: build stage: build
script: script:
- NODE_ENV=test npm run build - NODE_ENV=test npm run build
dependencies: dependencies:
- install - install
artifacts: artifacts:
paths: paths:
- .next - .next
expire_in: 1 week expire_in: 1 week
cache: cache:
key: ${CI_COMMIT_REF_SLUG} key: ${CI_COMMIT_REF_SLUG}
paths: paths:
- node_modules/ - node_modules/
- .next/cache/ - .next/cache/
test:e2e: test:e2e:
image: circleci/node:14-browsers image: circleci/node:14-browsers
needs: ["install", "build"] needs: ["install", "build"]
stage: test stage: test
script: script:
- npm run test:e2e - npm run testcafe
artifacts: artifacts:
paths: paths:
- e2e-screenshots - e2e-screenshots
expire_in: 1 week expire_in: 1 week
when: on_failure when: on_failure
publish:dev: publish:dev:
stage: publish stage: publish
image: docker:stable image: docker:stable
needs: ["build", "test:e2e", "es:lint", "css:lint"] needs: ["build", "test:e2e", "es:lint", "css:lint"]
services: services:
- docker:stable-dind - docker:stable-dind
only: only:
- master - master
script: script:
- docker info - docker info
- docker login -u gitlab-ci-token -p $CI_JOB_TOKEN $CI_REGISTRY - docker login -u gitlab-ci-token -p $CI_JOB_TOKEN $CI_REGISTRY
- docker build . -t "$IMAGE_NAME":latest - docker build . -t "$IMAGE_NAME":latest --build-arg NEXT_PUBLIC_API_URL=https://api.dev.sahkoinsinoorikilta.fi/api --build-arg NEXT_PUBLIC_SITE_URL=https://dev.sahkoinsinoorikilta.fi
- docker push "$IMAGE_NAME":latest - docker push "$IMAGE_NAME":latest
publish:prod: publish:prod:
stage: publish stage: publish
image: docker:stable image: docker:stable
services: services:
- docker:stable-dind - docker:stable-dind
only: only:
- production - production
script: script:
- docker info - docker info
- docker login -u gitlab-ci-token -p $CI_JOB_TOKEN $CI_REGISTRY - docker login -u gitlab-ci-token -p $CI_JOB_TOKEN $CI_REGISTRY
- docker build . -f Dockerfile.prod -t "$IMAGE_NAME":prod - docker build . -t "$IMAGE_NAME":prod
- docker push "$IMAGE_NAME":prod - docker push "$IMAGE_NAME":prod
deploy:dev: deploy:dev:
stage: deploy stage: deploy
image: docker:stable image: docker:stable
only: only:
- master - master
environment: environment:
name: dev name: dev
url: https://dev.sahkoinsinoorikilta.fi url: https://dev.sahkoinsinoorikilta.fi
variables: variables:
DOCKER_HOST: $DEV_CI_DOCKER_HOST DOCKER_HOST: $DEV_CI_DOCKER_HOST
DOCKER_TLS_VERIFY: 1 DOCKER_TLS_VERIFY: 1
before_script: before_script:
- mkdir -p ~/.docker - mkdir -p ~/.docker
- echo "$DEV_TLSCACERT" > ~/.docker/ca.pem - echo "$DEV_TLSCACERT" > ~/.docker/ca.pem
- echo "$DEV_TLSCERT" > ~/.docker/cert.pem - echo "$DEV_TLSCERT" > ~/.docker/cert.pem
- echo "$DEV_TLSKEY" > ~/.docker/key.pem - echo "$DEV_TLSKEY" > ~/.docker/key.pem
- docker login -u gitlab-ci-token -p "$CI_BUILD_TOKEN" "$CI_REGISTRY" - docker login -u gitlab-ci-token -p "$CI_BUILD_TOKEN" "$CI_REGISTRY"
script: script:
- docker stack deploy --with-registry-auth -c stack-compose-dev.yml "$SERVICE_NAME" - docker stack deploy --with-registry-auth -c stack-compose-dev.yml "$SERVICE_NAME"
after_script: after_script:
- docker logout "$CI_REGISTRY" - docker logout "$CI_REGISTRY"
deploy:prod: deploy:prod:
stage: deploy stage: deploy
image: docker:stable image: docker:stable
only: only:
- production - production
environment: environment:
name: production name: production
url: https://sahkoinsinoorikilta.fi url: https://sahkoinsinoorikilta.fi
when: manual when: manual
variables: variables:
DOCKER_HOST: $CI_DOCKER_HOST DOCKER_HOST: $CI_DOCKER_HOST
DOCKER_TLS_VERIFY: 1 DOCKER_TLS_VERIFY: 1
before_script: before_script:
- mkdir -p ~/.docker - mkdir -p ~/.docker
- echo "$TLSCACERT" > ~/.docker/ca.pem - echo "$TLSCACERT" > ~/.docker/ca.pem
- echo "$TLSCERT" > ~/.docker/cert.pem - echo "$TLSCERT" > ~/.docker/cert.pem
- echo "$TLSKEY" > ~/.docker/key.pem - echo "$TLSKEY" > ~/.docker/key.pem
- docker login -u gitlab-ci-token -p "$CI_BUILD_TOKEN" "$CI_REGISTRY" - docker login -u gitlab-ci-token -p "$CI_BUILD_TOKEN" "$CI_REGISTRY"
script: script:
- docker stack deploy --with-registry-auth -c stack-compose.yml "$SERVICE_NAME" - docker stack deploy --with-registry-auth -c stack-compose.yml "$SERVICE_NAME"
after_script: after_script:
- docker logout "$CI_REGISTRY" - docker logout "$CI_REGISTRY"
.nvmrc
+1 -1
View File
@@ -1 +1 @@
14.16.0 14
Dockerfile
+31 -16
View File
@@ -1,26 +1,41 @@
FROM node:14-alpine as builder # Install dependencies only when needed
FROM node:14-alpine AS deps
# Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
RUN apk add --no-cache libc6-compat
WORKDIR /app
COPY package.json package-lock.json ./ COPY package.json package-lock.json ./
RUN npm install RUN npm ci
COPY tsconfig.json next-env.d.ts .babelrc next.config.js next-sitemap.js ./ # Rebuild the source code only when needed
COPY src src/ FROM node:14-alpine AS builder
COPY public public/ WORKDIR /app
COPY types types/ COPY . .
COPY --from=deps /app/node_modules ./node_modules
ENV NEXT_TELEMETRY_DISABLED=1 ENV NEXT_TELEMETRY_DISABLED=1
ENV NEXT_PUBLIC_API_URL=https://api.dev.sahkoinsinoorikilta.fi/api ARG NEXT_PUBLIC_API_URL=https://api.sahkoinsinoorikilta.fi/api
ENV NEXT_PUBLIC_SITE_URL=https://dev.sahkoinsinoorikilta.fi ARG NEXT_PUBLIC_SITE_URL=https://sahkoinsinoorikilta.fi
RUN npm run build RUN npm run build
FROM node:14-alpine as server # Production image, copy all the files and run next
WORKDIR /www FROM node:14-alpine AS runner
COPY package.json package-lock.json next.config.js next-sitemap.js ./ WORKDIR /app
COPY --from=builder .next .next
COPY --from=builder node_modules node_modules ENV NODE_ENV production
COPY --from=builder public public
COPY --from=builder /app/next.config.js ./
COPY --from=builder /app/public ./public
COPY --from=builder /app/.next ./.next
COPY --from=builder /app/node_modules ./node_modules
COPY --from=builder /app/package.json ./package.json
RUN npm prune --production RUN npm prune --production
RUN addgroup -g 1001 -S nodejs
RUN adduser -S nextjs -u 1001
RUN chown -R nextjs:nodejs /app/.next
USER nextjs
EXPOSE 3000 EXPOSE 3000
ENTRYPOINT ["npm", "run", "serve"]
CMD ["npm", "run", "serve"]
Dockerfile.prod
-26
View File
@@ -1,26 +0,0 @@
FROM node:14-alpine as builder
COPY package.json package-lock.json ./
RUN npm install
COPY tsconfig.json next-env.d.ts .babelrc next.config.js next-sitemap.js ./
COPY src src/
COPY public public/
COPY types types/
ENV NEXT_TELEMETRY_DISABLED=1
ENV NEXT_PUBLIC_API_URL=https://api.sahkoinsinoorikilta.fi/api
ENV NEXT_PUBLIC_SITE_URL=https://sahkoinsinoorikilta.fi
RUN npm run build
FROM node:14-alpine as server
WORKDIR /www
COPY package.json package-lock.json next.config.js next-sitemap.js ./
COPY --from=builder .next .next
COPY --from=builder node_modules node_modules
COPY --from=builder public public
RUN npm prune --production
EXPOSE 3000
ENTRYPOINT ["npm", "run", "serve"]
next-sitemap.js
+2 -2
View File
@@ -1,5 +1,5 @@
module.exports = { module.exports = {
siteUrl: process.env.NEXT_PUBLIC_SITE_URL || "https://sahkoinsinoorikilta.fi", siteUrl: process.env.NEXT_PUBLIC_SITE_URL || "https://sahkoinsinoorikilta.fi",
generateRobotsTxt: true, generateRobotsTxt: true,
exclude: ["/events/*", "/feed/*", "/signup/*", "/admin/*"] exclude: ["/events/*", "/feed/*", "/signup/*", "/admin/*"],
} };
next.config.js
+3 -3
View File
@@ -6,12 +6,12 @@ module.exports = withBundleAnalyzer({
target: "server", target: "server",
images: { images: {
domains: [ domains: [
"sahkoinsinoorikilta.fi",
"prod.sahkoinsinoorikilta.fi",
"api.sahkoinsinoorikilta.fi", "api.sahkoinsinoorikilta.fi",
"static.sahkoinsinoorikilta.fi", "static.sahkoinsinoorikilta.fi",
"api.dev.sahkoinsinoorikilta.fi", "api.dev.sahkoinsinoorikilta.fi",
"placehold.it",
], ],
}, },
future: {
webpack5: true,
},
}); });
package-lock.json
Generated
+2304 -2528
View File
File diff suppressed because it is too large Load Diff
package.json
+49 -50
View File
@@ -27,62 +27,61 @@
"start": "next dev", "start": "next dev",
"start-prod": "next start --port ${SERVER_PORT:=80}", "start-prod": "next start --port ${SERVER_PORT:=80}",
"serve": "next start --port 3000", "serve": "next start --port 3000",
"test": "npm run test:e2e:verbose", "test": "npm run testcafe",
"test:e2e": "testcafe --list-browsers && npm-run-all -p -r serve testcafe", "testcafe": "testcafe --config-file testcafe.json",
"test:e2e:verbose": "npm-run-all -p -r serve testcafe:verbose",
"testcafe": "testcafe --skip-js-errors -S -s 'e2e-screenshots' --app-init-delay 2000 chrome:headless tests/testcafe",
"testcafe:verbose": "testcafe --skip-js-errors -S -s 'e2e-screenshots' --app-init-delay 2000 chrome tests/testcafe",
"build-analyze": "ANALYZE=true npm run build", "build-analyze": "ANALYZE=true npm run build",
"prepare": "husky install" "prepare": "husky install"
}, },
"devDependencies": { "devDependencies": {
"@types/js-cookie": "2.2.6", "@types/js-cookie": "^2.2.6",
"@types/react": "17.0.2", "@types/react": "^17.0.5",
"@types/react-beautiful-dnd": "13.0.0", "@types/react-beautiful-dnd": "^13.0.0",
"@types/react-csv": "1.1.1", "@types/react-csv": "^1.1.1",
"@types/react-dom": "17.0.1", "@types/react-dom": "^17.0.5",
"@types/react-jsonschema-form": "1.7.4", "@types/react-jsonschema-form": "^1.7.5",
"@types/shortid": "0.0.29", "@types/shortid": "^0.0.29",
"@types/styled-components": "5.1.7", "@types/styled-components": "^5.1.9",
"@typescript-eslint/eslint-plugin": "4.16.1", "@typescript-eslint/eslint-plugin": "^4.23.0",
"@typescript-eslint/parser": "4.16.1", "@typescript-eslint/parser": "^4.23.0",
"babel-plugin-styled-components": "1.12.0", "babel-plugin-styled-components": "^1.12.0",
"eslint": "7.21.0", "eslint": "^7.26.0",
"eslint-config-airbnb-typescript": "12.3.1", "eslint-config-airbnb-typescript": "^12.3.1",
"eslint-plugin-import": "2.22.1", "eslint-plugin-import": "^2.23.1",
"eslint-plugin-jsx-a11y": "6.4.1", "eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-react": "7.22.0", "eslint-plugin-react": "^7.23.2",
"eslint-plugin-react-hooks": "4.2.0", "eslint-plugin-react-hooks": "^4.2.0",
"husky": "5.1.3", "husky": "^6.0.0",
"next-sitemap": "^1.6.9", "next-sitemap": "^1.6.57",
"npm-run-all": "4.1.5", "npm-run-all": "^4.1.5",
"stylelint": "13.11.0", "stylelint": "^13.13.1",
"stylelint-config-recommended": "3.0.0", "stylelint-config-recommended": "^5.0.0",
"stylelint-config-styled-components": "0.1.1", "stylelint-config-styled-components": "^0.1.1",
"stylelint-processor-styled-components": "1.10.0", "stylelint-processor-styled-components": "^1.10.0",
"testcafe": "1.12.0", "testcafe": "^1.14.2",
"typescript": "4.2.2" "typescript": "^4.2.4"
}, },
"dependencies": { "dependencies": {
"@next/bundle-analyzer": "10.0.7", "@next/bundle-analyzer": "^10.2.0",
"axios": "0.21.1", "axios": "^0.21.1",
"date-fns": "2.18.0", "date-fns": "^2.21.3",
"fast-deep-equal": "^3.1.3", "fast-deep-equal": "^3.1.3",
"js-cookie": "2.2.1", "js-cookie": "^2.2.1",
"lodash": "4.17.21", "lodash": "^4.17.21",
"next": "10.1.2", "next": "^10.2.0",
"normalize.css": "8.0.1", "normalize.css": "^8.0.1",
"react": "17.0.1", "react": "^17.0.2",
"react-beautiful-dnd": "13.1.0", "react-beautiful-dnd": "^13.1.0",
"react-csv": "2.0.3", "react-csv": "^2.0.3",
"react-dom": "17.0.1", "react-dom": "^17.0.2",
"react-is": "17.0.2", "react-is": "^17.0.2",
"react-jsonschema-form": "1.8.1", "react-jsonschema-form": "^1.8.1",
"react-markdown": "5.0.3", "react-markdown": "^6.0.2",
"react-mde": "11.0.6", "react-mde": "^11.5.0",
"react-toastify": "^7.0.3", "react-toastify": "^7.0.4",
"shortid": "2.2.16", "rehype-raw": "^5.1.0",
"styled-components": "5.2.3", "rehype-sanitize": "^4.0.0",
"swr": "0.4.2" "shortid": "^2.2.16",
"styled-components": "^5.3.0",
"swr": "^0.5.6"
} }
} }
src/components/Footer/FooterContent.tsx
+2
View File
@@ -86,6 +86,8 @@ const FooterContent: React.FC = () => (
<Link to="https://api.sahkoinsinoorikilta.fi/members/application/">Jäseneksi</Link> <Link to="https://api.sahkoinsinoorikilta.fi/members/application/">Jäseneksi</Link>
<Link to="mailto:hallitus@sahkoinsinoorikilta.fi">Palaute</Link> <Link to="mailto:hallitus@sahkoinsinoorikilta.fi">Palaute</Link>
<Link to="https://static.sahkoinsinoorikilta.fi">Dokumenttiarkisto</Link> <Link to="https://static.sahkoinsinoorikilta.fi">Dokumenttiarkisto</Link>
<Link to="https://sik.kuvat.fi">Kuvagalleria</Link>
<Link to="https://static.sahkoinsinoorikilta.fi/logot-ja-grafiikka/">Logot ja grafiikka</Link>
</div> </div>
</Columns> </Columns>
</MarginSpace> </MarginSpace>
src/components/Navigation.tsx
+9 -8
View File
@@ -6,20 +6,21 @@ import Icon, { IconType } from "./Icon";
import NavbarDropdownLink from "./NavbarDropdownLink"; import NavbarDropdownLink from "./NavbarDropdownLink";
import NavbarChildLink from "./NavbarChildLink"; import NavbarChildLink from "./NavbarChildLink";
const renderNavigationDesktopItems = () => ( export const renderNavigationItems = (mobile = false) => (
<> <>
<NavbarDropdownLink to="/kilta" text="Kilta ›"> <NavbarDropdownLink to="/kilta" text="Kilta ›" exploded={mobile}>
<NavbarChildLink to="/kilta/toiminta">Toiminta</NavbarChildLink> <NavbarChildLink to="/kilta/toiminta">Toiminta</NavbarChildLink>
<NavbarChildLink to="/kilta/fuksi">Fuksi</NavbarChildLink> <NavbarChildLink to="/kilta/fuksi">Fuksi</NavbarChildLink>
<NavbarChildLink to="/kilta/kunnia">Kunnianosoitukset</NavbarChildLink> <NavbarChildLink to="/kilta/kunnianosoitukset">Kunnianosoitukset</NavbarChildLink>
<NavbarChildLink to="https://static.sahkoinsinoorikilta.fi">Dokumenttiarkisto</NavbarChildLink> <NavbarChildLink to="https://static.sahkoinsinoorikilta.fi">Dokumenttiarkisto</NavbarChildLink>
<NavbarChildLink to="https://sik.kuvat.fi">Kuvagalleria</NavbarChildLink>
</NavbarDropdownLink> </NavbarDropdownLink>
<NavbarDropdownLink to="/opinnot_ja_ura" text="Opinnot ja ura" /> <NavbarDropdownLink to="/opinnot_ja_ura" text="Opinnot ja ura" exploded={mobile} />
<NavbarDropdownLink to="/yritysyhteistyo" text="Yritysyhteistyö" /> <NavbarDropdownLink to="/yritysyhteistyo" text="Yritysyhteistyö" exploded={mobile} />
<NavbarDropdownLink to="/yhteystiedot" text="Yhteystiedot"> <NavbarDropdownLink to="/yhteystiedot" text="Yhteystiedot" exploded={mobile}>
{/* <NavbarChildLink to="https://en.wikipedia.org/wiki/Gay">Simo Höglund</NavbarChildLink> */} {/* <NavbarChildLink to="https://en.wikipedia.org/wiki/Gay">Simo Höglund</NavbarChildLink> */}
</NavbarDropdownLink> </NavbarDropdownLink>
<NavbarDropdownLink to="/in_english" text="In English" /> <NavbarDropdownLink to="/in_english" text="In English" exploded={mobile} />
</> </>
); );
@@ -104,7 +105,7 @@ interface NavigationProps {
} }
const Navigation: React.FC<NavigationProps> = ({ onMobileMenuOpen }) => { const Navigation: React.FC<NavigationProps> = ({ onMobileMenuOpen }) => {
const desktopItems = renderNavigationDesktopItems(); const desktopItems = renderNavigationItems();
return ( return (
<Nav> <Nav>
<DesktopContainer> <DesktopContainer>
src/components/NavigationMobile.tsx
+2 -20
View File
@@ -1,25 +1,7 @@
import React from "react"; import React from "react";
import styled from "styled-components"; import styled from "styled-components";
import { colors } from "@theme/colors"; import { colors } from "@theme/colors";
import NavbarDropdownLink from "./NavbarDropdownLink"; import { renderNavigationItems } from "./Navigation";
import NavbarChildLink from "./NavbarChildLink";
const renderNavigationMobileItems = () => (
<>
<NavbarDropdownLink to="/kilta" text="Kilta ›" exploded>
<NavbarChildLink to="/kilta/toiminta">Toiminta</NavbarChildLink>
<NavbarChildLink to="/kilta/fuksi">Fuksi</NavbarChildLink>
<NavbarChildLink to="/kilta/kunnia">Kunnianosoitukset</NavbarChildLink>
<NavbarChildLink to="https://static.sahkoinsinoorikilta.fi">Dokumenttiarkisto</NavbarChildLink>
</NavbarDropdownLink>
<NavbarDropdownLink to="/opinnot_ja_ura" text="Opinnot ja ura" exploded />
<NavbarDropdownLink to="/yritysyhteistyo" text="Yritysyhteistyö" exploded />
<NavbarDropdownLink to="/yhteystiedot" text="Yhteystiedot" exploded>
{/* <NavbarChildLink to="https://en.wikipedia.org/wiki/Gay">Simo Höglund</NavbarChildLink> */}
</NavbarDropdownLink>
<NavbarDropdownLink to="/in_english" text="In English" exploded />
</>
);
const Nav = styled.nav` const Nav = styled.nav`
padding: 1rem 2rem; padding: 1rem 2rem;
@@ -37,7 +19,7 @@ interface NavigationMobileProps {
const NavigationMobile: React.FC<NavigationMobileProps> = ({ mobileMenuOpen }) => ( const NavigationMobile: React.FC<NavigationMobileProps> = ({ mobileMenuOpen }) => (
<Nav hidden={!mobileMenuOpen}> <Nav hidden={!mobileMenuOpen}>
{renderNavigationMobileItems()} {renderNavigationItems(true)}
</Nav> </Nav>
); );
src/components/Widgets/MarkdownEditorWidget.tsx
+3 -1
View File
@@ -32,7 +32,9 @@ const MarkdownEditorWidget: React.FC<MarkdownEditorWidgetProps> = ({ value, onCh
onChange={onChange} onChange={onChange}
selectedTab={selectedTab} selectedTab={selectedTab}
onTabChange={setSelectedTab} onTabChange={setSelectedTab}
generateMarkdownPreview={(markdown) => Promise.resolve(<MarkdownStyles source={markdown} />)} generateMarkdownPreview={(markdown) => Promise.resolve(
<MarkdownStyles>{markdown}</MarkdownStyles>,
)}
/> />
</Container> </Container>
); );
src/pages/404.tsx
+14 -8
View File
@@ -2,15 +2,18 @@ import React from "react";
import { NextPage } from "next"; import { NextPage } from "next";
import Head from "next/head"; import Head from "next/head";
import styled from "styled-components"; import styled from "styled-components";
import Header from "@components/Header";
const NotFound = styled.main` const NotFound = styled.main`
text-align: center; flex: 1 0 auto;
font-size: 4rem; display: flex;
font-weight: 200; justify-content: center;
position: absolute; align-items: center;
height: 10rem; p {
top: calc(50vh - 5rem); text-align: center;
width: 100%; font-size: 4rem;
font-weight: 200;
}
`; `;
const NotFoundPage: NextPage = () => ( const NotFoundPage: NextPage = () => (
@@ -19,8 +22,11 @@ const NotFoundPage: NextPage = () => (
<title>404 | Ei vaan löydy</title> <title>404 | Ei vaan löydy</title>
<meta name="robots" content="noindex" /> <meta name="robots" content="noindex" />
</Head> </Head>
<Header />
<NotFound id="not-found"> <NotFound id="not-found">
<strong>404</strong> | Ei vaan löydy <p>
<strong>404</strong> | Ei&nbsp;vaan&nbsp;löydy
</p>
</NotFound> </NotFound>
</> </>
); );
src/pages/_app.tsx
+5 -16
View File
@@ -1,10 +1,10 @@
import React from "react"; import React from "react";
// import App from "next/app";
import type { AppProps /* , AppContext' */ } from "next/app";
import Head from "next/head"; import Head from "next/head";
import { AppProps } from "next/app";
import styled, { createGlobalStyle } from "styled-components"; import styled, { createGlobalStyle } from "styled-components";
import { ToastContainer } from "react-toastify"; import { ToastContainer } from "react-toastify";
import { colors } from "@theme/colors"; import { colors } from "@theme/colors";
import breakpoints from "@theme/breakpoints";
import LocaleStore from "../i18n"; import LocaleStore from "../i18n";
import "react-mde/lib/styles/css/react-mde-all.css"; import "react-mde/lib/styles/css/react-mde-all.css";
@@ -25,17 +25,17 @@ html {
font-size: ${fontSize * 0.75}pt; font-size: ${fontSize * 0.75}pt;
line-height: ${lineHeight}; line-height: ${lineHeight};
@media screen and (min-width: 1200px) { @media screen and (min-width: ${breakpoints.medium}) {
/* 16px */ /* 16px */
font-size: ${fontSize}pt; font-size: ${fontSize}pt;
} }
@media screen and (min-width: 1920px) { @media screen and (min-width: ${breakpoints.large}) {
/* 20px */ /* 20px */
font-size: ${fontSize * 1.25}pt; font-size: ${fontSize * 1.25}pt;
} }
@media screen and (min-width: 2560px) { @media screen and (min-width: ${breakpoints.xlarge}) {
/* 24px */ /* 24px */
font-size: ${fontSize * 1.5}pt; font-size: ${fontSize * 1.5}pt;
} }
@@ -150,15 +150,4 @@ const Web20App = ({ Component, pageProps }: AppProps) => (
</> </>
); );
// Only uncomment this method if you have blocking data requirements for
// every single page in your application. This disables the ability to
// perform automatic static optimization, causing every page in your app to
// be server-side rendered.
//
// export const getInitialProps = async (appContext: AppContext) => {
// // calls page's `getInitialProps` and fills `appProps.pageProps`
// const appProps = await App.getInitialProps(appContext);
// return { ...appProps }
// }
export default Web20App; export default Web20App;
src/pages/kilta/kunnia.tsx → src/pages/kilta/kunnianosoitukset.tsx
+1 -1
View File
@@ -7,7 +7,7 @@ import PageWrapper from "@views/common/PageWrapper";
const HonoraryPage: NextPage = () => ( const HonoraryPage: NextPage = () => (
<> <>
<Head> <Head>
<link rel="canonical" href={`${process.env.NEXT_PUBLIC_SITE_URL}/kilta/kunnia`} /> <link rel="canonical" href={`${process.env.NEXT_PUBLIC_SITE_URL}/kilta/kunnianosoitukset`} />
</Head> </Head>
<PageWrapper> <PageWrapper>
<HonoraryPageView /> <HonoraryPageView />
src/theme/breakpoints.ts
+4 -4
View File
@@ -1,10 +1,10 @@
type Keys = "mobile" | "medium" | "large" | "xlarge"; type Keys = "mobile" | "medium" | "large" | "xlarge";
const breakpointsNumber: Record<Keys, number> = { const breakpointsNumber: Record<Keys, number> = {
mobile: 800, mobile: 801,
medium: 1200, medium: 1201,
large: 1920, large: 1921,
xlarge: 2560, xlarge: 2561,
}; };
const breakpoints = Object.entries(breakpointsNumber).map(([k, v]) => [k, `${v}px`]).reduce((a, [k, v]) => ({ ...a, [k]: v }), {}); const breakpoints = Object.entries(breakpointsNumber).map(([k, v]) => [k, `${v}px`]).reduce((a, [k, v]) => ({ ...a, [k]: v }), {});
src/views/CorporatePage/JobAdList.tsx
+5 -1
View File
@@ -3,6 +3,8 @@ import styled from "styled-components";
import JobAd from "@models/JobAd"; import JobAd from "@models/JobAd";
import { Accordion } from "@components/index"; import { Accordion } from "@components/index";
import ReactMarkdown from "react-markdown"; import ReactMarkdown from "react-markdown";
import rehypeRaw from "rehype-raw";
import rehypeSanitize from "rehype-sanitize";
interface JobAdListProps { interface JobAdListProps {
jobAds: JobAd[]; jobAds: JobAd[];
@@ -25,7 +27,9 @@ const JobAdList: React.FC<JobAdListProps> = ({ jobAds }) => (
<p> <p>
{ad.description_fi} {ad.description_fi}
</p> </p>
<ReactMarkdown source={ad.content_fi} escapeHtml={false} /> <ReactMarkdown rehypePlugins={[rehypeRaw, rehypeSanitize]}>
{ad.content_fi}
</ReactMarkdown>
</div> </div>
</Accordion> </Accordion>
</li> </li>
src/views/EventPage/EventPageView.tsx
+3 -1
View File
@@ -1,6 +1,8 @@
import React from "react"; import React from "react";
import Image from "next/image"; import Image from "next/image";
import styled from "styled-components"; import styled from "styled-components";
import rehypeRaw from "rehype-raw";
import rehypeSanitize from "rehype-sanitize";
import colors from "@theme/colors"; import colors from "@theme/colors";
import Event from "@models/Event"; import Event from "@models/Event";
import { import {
@@ -85,7 +87,7 @@ const EventPageView: React.FC<EventPageViewProps> = ({ event }) => {
/> />
</h1> </h1>
<div> <div>
<Content source={content} escapeHtml={false} /> <Content rehypePlugins={[rehypeRaw, rehypeSanitize]}>{content}</Content>
<p> <p>
{`${t("Paikka")}: ${location}`} {`${t("Paikka")}: ${location}`}
</p> </p>
src/views/FeedPage/FeedPageView.tsx
+3 -1
View File
@@ -1,6 +1,8 @@
import React from "react"; import React from "react";
import Image from "next/image"; import Image from "next/image";
import styled from "styled-components"; import styled from "styled-components";
import rehypeRaw from "rehype-raw";
import rehypeSanitize from "rehype-sanitize";
import colors from "@theme/colors"; import colors from "@theme/colors";
import Post from "@models/Feed"; import Post from "@models/Feed";
import { TextSection, ChangeLanguageButton } from "@components/index"; import { TextSection, ChangeLanguageButton } from "@components/index";
@@ -70,7 +72,7 @@ const FeedPageView: React.FC<FeedPageViewProps> = ({ post }) => {
)} )}
</h1> </h1>
<div> <div>
<Content source={content} escapeHtml={false} /> <Content rehypePlugins={[rehypeRaw, rehypeSanitize]}>{content}</Content>
</div> </div>
</StyledTextSection> </StyledTextSection>
</> </>
src/views/HonoraryPage/HonoraryPageView.tsx
+530 -522
View File
File diff suppressed because it is too large Load Diff
src/views/StudiesPage/StudiesPageView.tsx
+5 -5
View File
@@ -49,16 +49,16 @@ const StudiesPageView: React.FC = () => (
<p> <p>
Fuksivuoden loppupuolella aloin haaveilla oman alan hommista ja päätin laittaa kesätyöhakemuksia yrityksiin ihan laidasta laitaan. Fuksivuoden loppupuolella aloin haaveilla oman alan hommista ja päätin laittaa kesätyöhakemuksia yrityksiin ihan laidasta laitaan.
Lopulta taisin laittaa niitä jopa 50… Ei mennyt kauaa, kun Profit Softwarelta oltiin yhteydessä ja pääsin sinne haastatteluun. Lopulta taisin laittaa niitä jopa 50… Ei mennyt kauaa, kun Profit Softwarelta oltiin yhteydessä ja pääsin sinne haastatteluun.
Ennen pitkää olikin jo kesä ja olin päässyt osaksi Profit Softwaren automaatiotraineeteamiä. Ennen pitkää olikin jo kesä ja olin päässyt osaksi Profit Softwaren automaatio-trainee-teamiä.
Jatkoin kesän jälkeen osa-aikaisena traineenä ja seuraavana kesänä pääsinkin scrum master -roolissa ohjaamaan useita erilaisia traineeprojekteja. Jatkoin kesän jälkeen osa-aikaisena traineenä ja seuraavana kesänä pääsinkin scrum master -roolissa ohjaamaan useita erilaisia trainee-projekteja.
Ihastuin projektienhallintaan ja jatkan projektitaitojen harjoittamista töissä edelleen. Ihastuin projektienhallintaan ja jatkan projektitaitojen harjoittamista töissä edelleen.
</p> </p>
<h6>Toni</h6> <h6>Toni</h6>
<p> <p>
Kuulin fuksivuotenani erään kurssin vierasluennoitsijalta Fingrid Datahub hankkeesta. Kuulin fuksivuotenani erään kurssin vierasluennoitsijalta Fingrid Datahub -hankkeesta.
Projekti vaikutti mielenkiintoiselta, koska se tulee muuttamaan suomen sähkömarkkinoiden viestintää. Projekti vaikutti mielenkiintoiselta, koska se tulee muuttamaan Suomen sähkömarkkinoiden viestintää.
Toisen vuoden opiskelijana kesätöitä hakemassa törmäsin työilmoitukseen, jossa haettiin Fingrid Datahub hankkeeseen testaajia. Toisen vuoden opiskelijana kesätöitä hakemassa törmäsin työilmoitukseen, jossa haettiin Fingrid Datahub -hankkeeseen testaajia.
Päätin laittaa hakemuksen vetämään ja onnekseni sain työpaikan. Päätin laittaa hakemuksen vetämään ja onnekseni sain työpaikan.
Toimin koko kesän sovellustestauksen parissa sekä kehittäen useita erilaisia sovelluksia testauksen automatisoimiseksi. Toimin koko kesän sovellustestauksen parissa sekä kehittäen useita erilaisia sovelluksia testauksen automatisoimiseksi.
Kesän päätyttyä sain onnekseni jatkoa työsopimukselle ja toimin sovellustestaajana kyseisessä projektissa edelleen. Kesän päätyttyä sain onnekseni jatkoa työsopimukselle ja toimin sovellustestaajana kyseisessä projektissa edelleen.
stack-compose-dev.yml
+1 -1
View File
@@ -1,4 +1,4 @@
version: '3.4' version: "3.4"
services: services:
frontend: frontend:
stack-compose.yml
+1 -1
View File
@@ -1,4 +1,4 @@
version: '3.4' version: "3.4"
services: services:
frontend: frontend:
testcafe.json
+12
View File
@@ -0,0 +1,12 @@
{
"src": "tests/testcafe",
"browsers": "all",
"concurrency": 1,
"screenshots": {
"path": "e2e-screenshots",
"takeOnFails": true
},
"skipJsErrors": true,
"appCommand": "npm run serve",
"appInitDelay": 2000
}
tests/testcafe/404.test.ts
-3
View File
@@ -4,9 +4,6 @@ import { getSiteRoot } from "./utils";
fixture`404 page renders and functions correctly`.page(`${getSiteRoot()}/404`); fixture`404 page renders and functions correctly`.page(`${getSiteRoot()}/404`);
test("Page contains the text 404", async (t) => { test("Page contains the text 404", async (t) => {
/**
* Test if there is a favicon element on the page
*/
const elem = Selector("#not-found"); const elem = Selector("#not-found");
await t.expect(elem.textContent).contains("404"); await t.expect(elem.textContent).contains("404");
}); });
tsconfig.json
+8 -2
View File
@@ -6,7 +6,10 @@
"forceConsistentCasingInFileNames": true, "forceConsistentCasingInFileNames": true,
"isolatedModules": true, "isolatedModules": true,
"jsx": "preserve", "jsx": "preserve",
"lib": ["dom", "esnext"], "lib": [
"dom",
"esnext"
],
"module": "esnext", "module": "esnext",
"moduleResolution": "node", "moduleResolution": "node",
"noEmit": true, "noEmit": true,
@@ -19,7 +22,10 @@
"sourceMap": true, "sourceMap": true,
"strict": false, // TODO: switch true "strict": false, // TODO: switch true
"target": "esnext", "target": "esnext",
"typeRoots": ["types", "node_modules/@types"], "typeRoots": [
"types",
"node_modules/@types"
],
"baseUrl": "./", "baseUrl": "./",
"paths": { "paths": {
"@api/*": [ "@api/*": [