@wger-project/react-components 25.10.16

package/package.json

@@ -0,0 +1,125 @@
+{
+  "name": "@wger-project/react-components",
+  "files": [
+    "README.md",
+    "LICENSE",
+    "index.html",
+    "src/",
+    "build/"
+  ],
+  "main": "build/main.js",
+  "exports": {
+    ".": "./build/index.js"
+  },
+  "version": "25.10.16",
+  "repository": "https://github.com/wger-project/react",
+  "type": "module",
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@emotion/babel-plugin": "^11.13.5",
+    "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.1",
+    "@hello-pangea/dnd": "^18.0.1",
+    "@mui/icons-material": "^7.3.4",
+    "@mui/lab": "^7.0.1-beta.18",
+    "@mui/material": "^7.3.4",
+    "@mui/system": "^7.3.3",
+    "@mui/x-data-grid": "^8.14.0",
+    "@mui/x-date-pickers": "^8.14.0",
+    "@tanstack/react-query": "^5.90.2",
+    "@vitejs/plugin-react": "^5.0.4",
+    "axios": "^1.12.2",
+    "formik": "^2.4.6",
+    "history": "^5.3.0",
+    "i18next": "^25.6.0",
+    "i18next-browser-languagedetector": "^8.2.0",
+    "i18next-http-backend": "^3.0.2",
+    "luxon": "^3.7.2",
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0",
+    "react-i18next": "^16.0.0",
+    "react-is": "^19.2.0",
+    "react-responsive": "^10.0.1",
+    "react-router-dom": "^7.9.4",
+    "react-simple-wysiwyg": "^3.4.1",
+    "recharts": "^3.2.1",
+    "slug": "^9.1.0",
+    "typescript": "^5.9.3",
+    "vite-tsconfig-paths": "^5.1.4",
+    "web-vitals": "^5.1.0",
+    "yup": "^1.7.1"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.37.0",
+    "@tanstack/react-query-devtools": "^5.90.2",
+    "@testing-library/dom": "^10.4.1",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.0",
+    "@testing-library/user-event": "^14.6.1",
+    "@types/jest": "^30.0.0",
+    "@types/lodash": "^4.17.20",
+    "@types/luxon": "^3.7.1",
+    "@types/node": "^22.18.9",
+    "@types/react": "^19.2.2",
+    "@types/react-dom": "^19.2.1",
+    "@types/react-is": "^19.2.0",
+    "@types/slug": "^5.0.9",
+    "@typescript-eslint/eslint-plugin": "^8.46.0",
+    "@typescript-eslint/parser": "^8.46.0",
+    "eslint": "^9.37.0",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^7.0.0",
+    "i18next-parser": "^9.3.0",
+    "jest": "^30.2.0",
+    "jest-environment-jsdom": "^30.2.0",
+    "jsdom": "^27.0.0",
+    "ts-jest": "^29.4.5",
+    "typescript-eslint": "^8.46.0",
+    "vite": "^7.1.9",
+    "vite-plugin-eslint": "^1.8.1",
+    "vitest": "^3.2.4"
+  },
+  "scripts": {
+    "start": "vite",
+    "build": "vite build",
+    "serve": "vite preview",
+    "test": "LANG=de_de jest",
+    "test:coverage": "LANG=de_de jest --coverage --collectCoverageFrom='!src/pages/**/*.tsx'",
+    "i18n": "i18next",
+    "lint": "eslint src",
+    "lint:quiet": "eslint --quiet src",
+    "lint:fix": "eslint --fix src"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "jest": {
+    "moduleNameMapper": {
+      "^axios$": "<rootDir>/node_modules/axios/dist/node/axios.cjs",
+      "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js",
+      "\\.(css|less)$": "<rootDir>/__mocks__/styleMock.js"
+    },
+    "preset": "ts-jest",
+    "testEnvironment": "jest-environment-jsdom",
+    "modulePaths": [
+      "<rootDir>/src"
+    ],
+    "setupFilesAfterEnv": [
+      "./src/setupTests.ts"
+    ]
+  },
+  "packageManager": "npm@10.5.0"
+}

package/src/@types/i18next.d.ts

@@ -0,0 +1,13 @@
+import "i18next";
+import { resources } from "i18n";
+
+declare module "i18next" {
+    
+    // Extend CustomTypeOptions
+    interface CustomTypeOptions {
+        defaultNS: "common";
+        resources: {
+            common: typeof resources.en.common;
+        };
+    }
+}

package/src/App.tsx

@@ -0,0 +1,25 @@
+import Grid from '@mui/material/Grid';
+import { Header, } from 'components';
+import { Notifications } from 'components/Core/Notifications';
+import React from 'react';
+import { WgerRoutes } from "routes";
+
+
+function App() {
+
+    return (
+        (<Grid container>
+            <Grid size={12}>
+                <Header />
+            </Grid>
+            <Grid size={12}>
+                <Notifications />
+            </Grid>
+            <Grid size={12}>
+                <WgerRoutes />
+            </Grid>
+        </Grid>)
+    );
+}
+
+export default App;

package/src/assets/images/discord-logo.svg

@@ -0,0 +1 @@
+<svg fill="#fff" xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 50 50" width="50px" height="50px"><path d="M 18.90625 7 C 18.90625 7 12.539063 7.4375 8.375 10.78125 C 8.355469 10.789063 8.332031 10.800781 8.3125 10.8125 C 7.589844 11.480469 7.046875 12.515625 6.375 14 C 5.703125 15.484375 4.992188 17.394531 4.34375 19.53125 C 3.050781 23.808594 2 29.058594 2 34 C 1.996094 34.175781 2.039063 34.347656 2.125 34.5 C 3.585938 37.066406 6.273438 38.617188 8.78125 39.59375 C 11.289063 40.570313 13.605469 40.960938 14.78125 41 C 15.113281 41.011719 15.429688 40.859375 15.625 40.59375 L 18.0625 37.21875 C 20.027344 37.683594 22.332031 38 25 38 C 27.667969 38 29.972656 37.683594 31.9375 37.21875 L 34.375 40.59375 C 34.570313 40.859375 34.886719 41.011719 35.21875 41 C 36.394531 40.960938 38.710938 40.570313 41.21875 39.59375 C 43.726563 38.617188 46.414063 37.066406 47.875 34.5 C 47.960938 34.347656 48.003906 34.175781 48 34 C 48 29.058594 46.949219 23.808594 45.65625 19.53125 C 45.007813 17.394531 44.296875 15.484375 43.625 14 C 42.953125 12.515625 42.410156 11.480469 41.6875 10.8125 C 41.667969 10.800781 41.644531 10.789063 41.625 10.78125 C 37.460938 7.4375 31.09375 7 31.09375 7 C 31.019531 6.992188 30.949219 6.992188 30.875 7 C 30.527344 7.046875 30.234375 7.273438 30.09375 7.59375 C 30.09375 7.59375 29.753906 8.339844 29.53125 9.40625 C 27.582031 9.09375 25.941406 9 25 9 C 24.058594 9 22.417969 9.09375 20.46875 9.40625 C 20.246094 8.339844 19.90625 7.59375 19.90625 7.59375 C 19.734375 7.203125 19.332031 6.964844 18.90625 7 Z M 18.28125 9.15625 C 18.355469 9.359375 18.40625 9.550781 18.46875 9.78125 C 16.214844 10.304688 13.746094 11.160156 11.4375 12.59375 C 11.074219 12.746094 10.835938 13.097656 10.824219 13.492188 C 10.816406 13.882813 11.039063 14.246094 11.390625 14.417969 C 11.746094 14.585938 12.167969 14.535156 12.46875 14.28125 C 17.101563 11.410156 22.996094 11 25 11 C 27.003906 11 32.898438 11.410156 37.53125 14.28125 C 37.832031 14.535156 38.253906 14.585938 38.609375 14.417969 C 38.960938 14.246094 39.183594 13.882813 39.175781 13.492188 C 39.164063 13.097656 38.925781 12.746094 38.5625 12.59375 C 36.253906 11.160156 33.785156 10.304688 31.53125 9.78125 C 31.59375 9.550781 31.644531 9.359375 31.71875 9.15625 C 32.859375 9.296875 37.292969 9.894531 40.3125 12.28125 C 40.507813 12.460938 41.1875 13.460938 41.8125 14.84375 C 42.4375 16.226563 43.09375 18.027344 43.71875 20.09375 C 44.9375 24.125 45.921875 29.097656 45.96875 33.65625 C 44.832031 35.496094 42.699219 36.863281 40.5 37.71875 C 38.5 38.496094 36.632813 38.84375 35.65625 38.9375 L 33.96875 36.65625 C 34.828125 36.378906 35.601563 36.078125 36.28125 35.78125 C 38.804688 34.671875 40.15625 33.5 40.15625 33.5 C 40.570313 33.128906 40.605469 32.492188 40.234375 32.078125 C 39.863281 31.664063 39.226563 31.628906 38.8125 32 C 38.8125 32 37.765625 32.957031 35.46875 33.96875 C 34.625 34.339844 33.601563 34.707031 32.4375 35.03125 C 32.167969 35 31.898438 35.078125 31.6875 35.25 C 29.824219 35.703125 27.609375 36 25 36 C 22.371094 36 20.152344 35.675781 18.28125 35.21875 C 18.070313 35.078125 17.8125 35.019531 17.5625 35.0625 C 16.394531 34.738281 15.378906 34.339844 14.53125 33.96875 C 12.234375 32.957031 11.1875 32 11.1875 32 C 10.960938 31.789063 10.648438 31.699219 10.34375 31.75 C 9.957031 31.808594 9.636719 32.085938 9.53125 32.464844 C 9.421875 32.839844 9.546875 33.246094 9.84375 33.5 C 9.84375 33.5 11.195313 34.671875 13.71875 35.78125 C 14.398438 36.078125 15.171875 36.378906 16.03125 36.65625 L 14.34375 38.9375 C 13.367188 38.84375 11.5 38.496094 9.5 37.71875 C 7.300781 36.863281 5.167969 35.496094 4.03125 33.65625 C 4.078125 29.097656 5.0625 24.125 6.28125 20.09375 C 6.90625 18.027344 7.5625 16.226563 8.1875 14.84375 C 8.8125 13.460938 9.492188 12.460938 9.6875 12.28125 C 12.707031 9.894531 17.140625 9.296875 18.28125 9.15625 Z M 18.5 21 C 15.949219 21 14 23.316406 14 26 C 14 28.683594 15.949219 31 18.5 31 C 21.050781 31 23 28.683594 23 26 C 23 23.316406 21.050781 21 18.5 21 Z M 31.5 21 C 28.949219 21 27 23.316406 27 26 C 27 28.683594 28.949219 31 31.5 31 C 34.050781 31 36 28.683594 36 26 C 36 23.316406 34.050781 21 31.5 21 Z M 18.5 23 C 19.816406 23 21 24.265625 21 26 C 21 27.734375 19.816406 29 18.5 29 C 17.183594 29 16 27.734375 16 26 C 16 24.265625 17.183594 23 18.5 23 Z M 31.5 23 C 32.816406 23 34 24.265625 34 26 C 34 27.734375 32.816406 29 31.5 29 C 30.183594 29 29 27.734375 29 26 C 29 24.265625 30.183594 23 31.5 23 Z"/></svg>

package/src/assets/images/get-it-on-google-play.svg

@@ -0,0 +1 @@
+<svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1477 500" enable-background="new 0 0 1477 500" width="2500" height="846"><style>.st0{fill:#fff}.st1{fill:url(#orange_1_)}.st2{fill:url(#path-3_2_)}.st3{filter:url(#Adobe_OpacityMaskFilter)}.st4{mask:url(#mask-4);fill:none}.st5{filter:url(#Adobe_OpacityMaskFilter_1_)}.st6{mask:url(#mask-6);fill:url(#Fill-7_3_)}.st7{fill:url(#path-9_2_)}.st8{filter:url(#Adobe_OpacityMaskFilter_2_)}.st9{mask:url(#mask-10);fill:none}</style><title>Google</title><g id="Page-1"><g id="Artboard-1" transform="translate(-461 -270)"><g id="Play-Store" transform="translate(461 270)"><path id="background" class="st0" d="M60 0h1357c33.1 0 60 26.9 60 60v380c0 33.1-26.9 60-60 60H60c-33.1 0-60-26.9-60-60V60C0 26.9 26.9 0 60 0z"/><g id="icon" transform="translate(60 179)"><linearGradient id="orange_1_" gradientUnits="userSpaceOnUse" x1="-70.717" y1="570.714" x2="-70.398" y2="570.201" gradientTransform="matrix(234.0913 0 0 -256.5288 16609.81 146485.188)"><stop offset="0" stop-color="#ff177b"/><stop offset="1" stop-color="#ffec73"/></linearGradient><path id="orange" class="st1" d="M120.2 61S18.3 4.5 12.3 1.2C6.3-2.1.3-.1.3 6.8v243.5c0 5.2 4.3 7.4 9.5 4.6 5.2-2.9 110.4-61.2 110.4-61.2s14.3-7.9 21.4-11.9c11.5-6.4 34.5-19.1 34.5-19.1s47.5-26.3 53.8-29.8c6.3-3.5 5.7-8.3.4-11-5.3-2.7-54.1-30-54.1-30l-56-30.9z"/><g id="blue"><g id="Clip-2"><linearGradient id="path-3_2_" gradientUnits="userSpaceOnUse" x1="-70.261" y1="571.394" x2="-70.632" y2="569.943" gradientTransform="matrix(139 0 0 -256 9858 146183)"><stop offset="0" stop-color="#064aa2"/><stop offset="1" stop-color="#63ffd4"/></linearGradient><path id="path-3_1_" class="st2" d="M139 127L5 0C1.9.7 0 3.1 0 7v243c0 3.3 1.3 5.3 3 6l136-129z"/></g><defs><filter id="Adobe_OpacityMaskFilter" filterUnits="userSpaceOnUse" x="0" y=".1" width="234" height="257"><feColorMatrix values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/></filter></defs><mask maskUnits="userSpaceOnUse" x="0" y=".1" width="234" height="257" id="mask-4"><g class="st3"><path id="path-3" class="st0" d="M139 127L5 0C1.9.7 0 3.1 0 7v243c0 3.3 1.3 5.3 3 6l136-129z"/></g></mask><path id="Fill-1" class="st4" d="M176 92l-56-31c-.2.5-102.1-56.1-108-59C6-1.8 0 .3 0 7v244c0 5.4 4.3 7.6 9 5 5.7-3.2 110.8-61.5 111-62l56-31c-.3.4 47.1-25.9 53-29 6.8-3.9 6.1-8.7 1-11-5.5-3.2-54.3-30.5-54-31"/></g><g id="red" transform="translate(2.983 127.504)"><defs><filter id="Adobe_OpacityMaskFilter_1_" filterUnits="userSpaceOnUse" x="-3" y="-127.4" width="234" height="257"><feColorMatrix values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/></filter></defs><mask maskUnits="userSpaceOnUse" x="-3" y="-127.4" width="234" height="257" id="mask-6"><g class="st5"><path id="path-5" class="st0" d="M5.5 127.8L83 85.2c19.1-10.6 34.2-19 34.2-19l56.3-30.3L136-.5 0 128.5c1.5.5 4.2.2 6.3-.8"/></g></mask><linearGradient id="Fill-7_3_" gradientUnits="userSpaceOnUse" x1="-73.347" y1="443.327" x2="-74.108" y2="442.827" gradientTransform="matrix(233.965 0 0 -256.9642 17295.543 113843.219)"><stop offset="0" stop-color="#ff4521"/><stop offset="1" stop-color="#8a33db"/></linearGradient><path id="Fill-7" class="st6" d="M117-66.5c-.2.5-102.1-56.1-108-59-6-3.8-12-1.7-12 5v244c0 5.4 4.3 7.6 9 5 5.7-3.2 110.8-61.5 111-62l56-31c-.3.4 47.1-25.9 53-29 6.8-3.9 6.1-8.7 1-11-5.5-3.2-54.3-30.5-54-31l-56-31z"/></g><g id="green" transform="translate(4.98)"><g id="Clip-5"><linearGradient id="path-9_2_" gradientUnits="userSpaceOnUse" x1="-75.767" y1="570.364" x2="-75.125" y2="569.122" gradientTransform="matrix(171.2139 0 0 -127.4293 12997.62 72640.227)"><stop offset="0" stop-color="#00a3b5"/><stop offset="1" stop-color="#d6ffa1"/></linearGradient><path id="path-9_1_" class="st7" d="M7.1 1.1C4.5-.2 2-.6-.1-.1L134 127.1 171.1 92l-55.9-31S62.5 31.8 30.7 14.2L7.1 1.1z"/></g><defs><filter id="Adobe_OpacityMaskFilter_2_" filterUnits="userSpaceOnUse" x="-5" y=".1" width="234" height="257"><feColorMatrix values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/></filter></defs><mask maskUnits="userSpaceOnUse" x="-5" y=".1" width="234" height="257" id="mask-10"><g class="st8"><path id="path-9" class="st0" d="M7.1 1.1C4.5-.2 2-.6-.1-.1L134 127.1 171.1 92l-55.9-31S62.5 31.8 30.7 14.2L7.1 1.1z"/></g></mask><path id="Fill-4" class="st9" d="M171 92l-56-31c-.2.5-102-56.1-108-59C1-1.8-5 .3-5 7v244c0 5.4 4.3 7.6 9 5 5.7-3.2 110.8-61.5 111-62l56-31c-.3.4 47.1-25.9 53-29 6.8-3.9 6.1-8.7 1-11-5.5-3.2-54.3-30.5-54-31"/></g></g><g id="Google-play" transform="translate(347 201)"><path id="Fill-1_1_" d="M664.6 147.9l-11.1 10.5c-2.6 1.4-5.1 3.1-7.6 4.2-7.7 3.5-15.5 4.4-22.5 4.4-7.4 0-19-.5-30.8-9.1-16.4-11.6-23.6-31.7-23.6-49.1 0-36.1 29.2-53.8 53.1-53.8 8.3 0 16.9 2.1 23.8 6.5 11.6 7.7 14.6 17.7 16.2 23.1l-54.4 22.1-17.8 1.4c5.8 29.6 25.7 46.8 47.7 46.8 11 0 19.1-3.6 26.6-7.3 0 0 1.5-.8.4.3zm-33.2-59.4c4.4-1.6 6.6-3 6.6-6.3 0-9.4-10.3-20.2-22.7-20.2-9.1 0-26.3 7.3-26.3 32.6 0 4 .5 8.2.7 12.4l41.7-18.5z"/><path id="Fill-2" d="M551 146.6c0 9 1.6 10.4 9.2 11.1 4 .5 7.9.7 11.8 1.1l-8.5 5.1h-40.7c5.3-7 6.3-7.7 6.3-12.3v-5.2l-.1-138h-18L528.3 0h33c-7.2 4.2-9.3 6.7-10.2 14.8l-.1 131.8"/><path id="Fill-3" d="M487.9 66.4c5.3 4.4 16.3 13.7 16.3 31.3 0 17.2-9.6 25.3-19.3 33-3 3-6.5 6.3-6.5 11.4 0 5.1 3.5 7.9 6 10l8.3 6.5c10.1 8.6 19.3 16.5 19.3 32.5 0 21.8-21 43.9-60.6 43.9-33.4 0-49.5-16-49.5-33.2 0-8.4 4.1-20.2 17.8-28.3 14.3-8.8 33.6-10 44-10.7-3.2-4.2-6.9-8.6-6.9-15.8 0-3.9 1.2-6.3 2.3-9.1-2.5.2-5.1.5-7.4.5-24.4 0-38.2-18.4-38.2-36.5 0-10.7 4.8-22.5 14.8-31.1C441.4 59.9 457.1 58 469.5 58H517l-14.8 8.4h-14.3zm-16.2 102.9c-1.9-.3-3-.3-5.3-.3-2.1 0-14.7.5-24.4 3.8-5.1 1.9-20 7.6-20 24.4 0 16.8 16 28.9 40.9 28.9 22.3 0 34.1-10.9 34.1-25.5 0-12.2-7.7-18.6-25.3-31.3zm6.5-44.8c5.3-5.3 5.8-12.7 5.8-16.9 0-16.7-9.8-42.6-28.9-42.6-5.9 0-12.4 3-16.1 7.7-3.9 4.8-5 11.1-5 17.1 0 15.5 9 41.2 28.7 41.2 5.7 0 11.9-2.8 15.5-6.5z"/><path id="Fill-4_1_" d="M344.3 167c-36.7 0-56.3-29-56.3-55.2 0-30.6 24.7-56.8 59.8-56.8 33.9 0 55.2 26.9 55.2 55.2 0 27.6-21 56.8-58.7 56.8zm28.7-18.9c5.6-7.5 7-16.9 7-26 0-20.7-9.7-60.1-38.5-60.1-7.6 0-15.3 3-20.9 8-9 8.2-10.7 18.5-10.7 28.6 0 23.2 11.3 61.4 39.4 61.4 9.2 0 18.4-4.4 23.7-11.9z"/><path id="Fill-5" d="M221.3 167c-36.7 0-56.3-29-56.3-55.2 0-30.6 24.7-56.8 59.8-56.8 33.9 0 55.2 26.9 55.2 55.2 0 27.6-21 56.8-58.7 56.8zm28.7-18.9c5.6-7.5 7-16.9 7-26 0-20.7-9.8-60.1-38.5-60.1-7.7 0-15.3 3-20.9 8-9.1 8.2-10.7 18.5-10.7 28.6 0 23.2 11.4 61.4 39.4 61.4 9.2 0 18.4-4.4 23.7-11.9z"/><path id="Fill-6" d="M149.8 160.1l-31.1 7.2c-12.6 2-23.9 3.8-35.9 3.8C22.8 171 0 126.6 0 91.8 0 49.4 32.4 10 87.8 10c11.7 0 23 1.7 33.3 4.6 16.3 4.6 23.9 10.3 28.7 13.6l-18.1 17.3-7.6 1.7 5.4-8.7c-7.4-7.2-20.9-20.6-46.5-20.6-34.3 0-60.2 26.2-60.2 64.5 0 41.1 29.5 79.8 76.9 79.8 13.9 0 21.1-2.8 27.6-5.4v-35.3l-32.8 1.8 17.4-9.4H158l-5.6 5.5c-1.5 1.3-1.7 1.7-2.2 3.5-.2 2-.4 8.3-.4 10.6v26.6"/><path id="Fill-7_1_" d="M731.7 148.9V208H720V57.7h11.7v17.1c7.6-11.1 21.6-19.8 37.7-19.8 29 0 48.6 22.1 48.6 57 0 34.7-19.5 57.2-48.6 57.2-15.2 0-28.9-7.9-37.7-20.3zm74.3-36c0-26.6-13.7-46.9-38.1-46.9-15.1 0-29.6 12-35.9 22.5v48.6c6.3 10.5 20.8 22.9 35.9 22.9 24.4 0 38.1-20.5 38.1-47.1z"/><path id="Fill-8" d="M834 16h12v151h-12V16z"/><path id="Fill-9" d="M976.5 197.6c2.5 1.1 6.8 1.8 9.5 1.8 7.2 0 12.1-2.9 16.6-13.3l8.5-19.4L965 57h13.1l39.5 95.1 39.2-95.1h13.2l-56.2 132.7c-5.8 13.7-15 20.3-27.6 20.3-3.8 0-8.8-.7-11.7-1.6l2-10.8"/><path id="Fill-10" d="M943.4 166.9c-.8-3.8-1.4-7.1-1.8-9.9-.4-2.8-.6-5.6-.6-8.5-4 5.9-9.7 10.9-17.1 14.8-7.3 3.9-14.3 5.8-23.8 5.8-11.5 0-20.4-2.8-26.7-8.6-6.3-5.7-9.5-13.5-9.5-23.3s4.6-17.8 13.8-23.9c9.2-6.1 21.1-9.2 35.8-9.2h27.4V90.5c0-7.8-2.7-14-8-18.4-5.3-4.5-12.8-6.7-22.5-6.7-8.9 0-16.1 2.1-21.6 6.1-5.4 4.1-8.2 9.2-8.2 15.3h-12l-.2-.6c-.4-8.3 3.3-15.5 11.4-21.8 8-6.3 18.4-9.4 31.3-9.4 12.8 0 23.2 3.1 31 9.3 7.8 6.1 11.7 15 11.7 26.5v54c0 3.9.2 7.6.7 11.3.5 3.7 1.3 7.3 2.3 10.8h-13.4zm-41.8-7.9c10 0 17.2-2.3 24.5-6.7 7.3-4.4 12.2-10.2 14.8-17.2V114h-27.6c-10.5 0-19.2 2.3-26.1 7.1-6.9 4.7-10.3 10.4-10.3 17.1 0 6.3 2.2 11.3 6.6 15.1 4.5 3.8 10.5 5.7 18.1 5.7z"/></g><g id="Get-it-on" transform="translate(343 79)"><path id="Fill-1_2_" d="M0 36.3C0 14.8 17.2.9 38.6.9c14.3 0 23.7 6.4 29.6 14.2l-10.5 5.6c-4-5.1-10.9-9.1-19.1-9.1-14.5 0-25.4 10.3-25.4 24.7C13.3 50.6 24.1 61 38.6 61c7.5 0 14.1-3.2 17.4-6.2V44.3H34V33.7h34.8v25.5c-7.2 7.5-17.5 12.5-30.2 12.5C17.2 71.8 0 57.8 0 36.3"/><path id="Fill-2_1_" d="M85.5 70.8V2h51.1v10.6h-38v17.7h37.2V41H98.6v19.2h38v10.6H85.5"/><path id="Fill-3_1_" d="M171.3 70.8V12.6h-22.2V2h57.3v10.6h-22.2v58.2h-12.9"/><path id="Fill-4_2_" d="M252.3 2h12.5v68.8h-12.5V2z"/><path id="Fill-5_1_" d="M300.6 70.8V12.6h-22.2V2h57.3v10.6h-22.2v58.2h-12.9"/><path id="Fill-6_1_" d="M378.5 36.4C378.5 16 394.2 1 416.6 1c22.2 0 38 15 38 35.4s-15.9 35.4-38 35.4c-22.4 0-38.1-15-38.1-35.4zm62.5-.6c0-14-9.6-24.5-24.5-24.5-15 0-24.5 10.5-24.5 24.5 0 13.9 9.5 24.5 24.5 24.5 14.9 0 24.5-10.5 24.5-24.5z"/><path id="Fill-7_2_" d="M520.3 70.8L482 21.6v49.2h-12.9V2h13.2l37.5 47.7V2h12.9v68.8h-12.4"/></g></g></g></g></svg>

package/src/assets/images/twitter.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
+    width="50" height="50"
+    viewBox="0 0 50 50"
+    fill="#fff"><path d="M 34.21875 5.46875 C 28.238281 5.46875 23.375 10.332031 23.375 16.3125 C 23.375 16.671875 23.464844 17.023438 23.5 17.375 C 16.105469 16.667969 9.566406 13.105469 5.125 7.65625 C 4.917969 7.394531 4.597656 7.253906 4.261719 7.277344 C 3.929688 7.300781 3.632813 7.492188 3.46875 7.78125 C 2.535156 9.386719 2 11.234375 2 13.21875 C 2 15.621094 2.859375 17.820313 4.1875 19.625 C 3.929688 19.511719 3.648438 19.449219 3.40625 19.3125 C 3.097656 19.148438 2.726563 19.15625 2.425781 19.335938 C 2.125 19.515625 1.941406 19.839844 1.9375 20.1875 L 1.9375 20.3125 C 1.9375 23.996094 3.84375 27.195313 6.65625 29.15625 C 6.625 29.152344 6.59375 29.164063 6.5625 29.15625 C 6.21875 29.097656 5.871094 29.21875 5.640625 29.480469 C 5.410156 29.742188 5.335938 30.105469 5.4375 30.4375 C 6.554688 33.910156 9.40625 36.5625 12.9375 37.53125 C 10.125 39.203125 6.863281 40.1875 3.34375 40.1875 C 2.582031 40.1875 1.851563 40.148438 1.125 40.0625 C 0.65625 40 0.207031 40.273438 0.0507813 40.71875 C -0.109375 41.164063 0.0664063 41.660156 0.46875 41.90625 C 4.980469 44.800781 10.335938 46.5 16.09375 46.5 C 25.425781 46.5 32.746094 42.601563 37.65625 37.03125 C 42.566406 31.460938 45.125 24.226563 45.125 17.46875 C 45.125 17.183594 45.101563 16.90625 45.09375 16.625 C 46.925781 15.222656 48.5625 13.578125 49.84375 11.65625 C 50.097656 11.285156 50.070313 10.789063 49.777344 10.445313 C 49.488281 10.101563 49 9.996094 48.59375 10.1875 C 48.078125 10.417969 47.476563 10.441406 46.9375 10.625 C 47.648438 9.675781 48.257813 8.652344 48.625 7.5 C 48.75 7.105469 48.613281 6.671875 48.289063 6.414063 C 47.964844 6.160156 47.511719 6.128906 47.15625 6.34375 C 45.449219 7.355469 43.558594 8.066406 41.5625 8.5 C 39.625 6.6875 37.074219 5.46875 34.21875 5.46875 Z M 34.21875 7.46875 C 36.769531 7.46875 39.074219 8.558594 40.6875 10.28125 C 40.929688 10.53125 41.285156 10.636719 41.625 10.5625 C 42.929688 10.304688 44.167969 9.925781 45.375 9.4375 C 44.679688 10.375 43.820313 11.175781 42.8125 11.78125 C 42.355469 12.003906 42.140625 12.53125 42.308594 13.011719 C 42.472656 13.488281 42.972656 13.765625 43.46875 13.65625 C 44.46875 13.535156 45.359375 13.128906 46.3125 12.875 C 45.457031 13.800781 44.519531 14.636719 43.5 15.375 C 43.222656 15.578125 43.070313 15.90625 43.09375 16.25 C 43.109375 16.65625 43.125 17.058594 43.125 17.46875 C 43.125 23.71875 40.726563 30.503906 36.15625 35.6875 C 31.585938 40.871094 24.875 44.5 16.09375 44.5 C 12.105469 44.5 8.339844 43.617188 4.9375 42.0625 C 9.15625 41.738281 13.046875 40.246094 16.1875 37.78125 C 16.515625 37.519531 16.644531 37.082031 16.511719 36.683594 C 16.378906 36.285156 16.011719 36.011719 15.59375 36 C 12.296875 35.941406 9.535156 34.023438 8.0625 31.3125 C 8.117188 31.3125 8.164063 31.3125 8.21875 31.3125 C 9.207031 31.3125 10.183594 31.1875 11.09375 30.9375 C 11.53125 30.808594 11.832031 30.402344 11.816406 29.945313 C 11.800781 29.488281 11.476563 29.097656 11.03125 29 C 7.472656 28.28125 4.804688 25.382813 4.1875 21.78125 C 5.195313 22.128906 6.226563 22.402344 7.34375 22.4375 C 7.800781 22.464844 8.214844 22.179688 8.355469 21.746094 C 8.496094 21.3125 8.324219 20.835938 7.9375 20.59375 C 5.5625 19.003906 4 16.296875 4 13.21875 C 4 12.078125 4.296875 11.03125 4.6875 10.03125 C 9.6875 15.519531 16.6875 19.164063 24.59375 19.5625 C 24.90625 19.578125 25.210938 19.449219 25.414063 19.210938 C 25.617188 18.96875 25.695313 18.648438 25.625 18.34375 C 25.472656 17.695313 25.375 17.007813 25.375 16.3125 C 25.375 11.414063 29.320313 7.46875 34.21875 7.46875 Z"></path>
+</svg>

package/src/components/BodyWeight/Form/WeightForm.test.tsx

@@ -0,0 +1,100 @@
+import { QueryClientProvider } from "@tanstack/react-query";
+import { fireEvent, render, screen, waitFor, within } from '@testing-library/react';
+import userEvent from "@testing-library/user-event";
+import { WeightForm } from "components/BodyWeight/Form/WeightForm";
+import { WeightEntry } from "components/BodyWeight/model";
+import { useAddWeightEntryQuery, useBodyWeightQuery, useEditWeightEntryQuery } from "components/BodyWeight/queries";
+import React from 'react';
+import { testQueryClient } from "tests/queryClient";
+import { testWeightEntries } from "tests/weight/testData";
+
+jest.mock("services");
+jest.mock("components/BodyWeight/queries");
+
+
+describe("Test WeightForm component", () => {
+
+    beforeEach(() => {
+        (useBodyWeightQuery as jest.Mock).mockImplementation(() => ({ isSuccess: true, data: testWeightEntries }));
+    });
+
+
+    test('Passing an existing entry renders its values in the form', () => {
+
+        // Arrange
+        const weightEntry = new WeightEntry(
+            new Date('2021-12-10 17:00'),
+            80,
+            1,
+        );
+
+        // Act
+        render(
+            <QueryClientProvider client={testQueryClient}>
+                <WeightForm weightEntry={weightEntry} />
+            </QueryClientProvider>
+        );
+
+        // Assert
+        expect(screen.getByDisplayValue('12/10/2021 05:00 PM')).toBeInTheDocument();
+        expect(screen.getByDisplayValue('80')).toBeInTheDocument();
+        expect(screen.getAllByLabelText('date').length).toBeGreaterThan(0);
+        expect(screen.getByLabelText('weight')).toBeInTheDocument();
+        expect(screen.getByText('submit')).toBeInTheDocument();
+    });
+
+    test('Editing an existing entry', async () => {
+
+        // Arrange
+        const weightEntry = new WeightEntry(
+            new Date('2022-02-28'),
+            80,
+            1
+        );
+
+        // Act
+        render(
+            <QueryClientProvider client={testQueryClient}>
+                <WeightForm weightEntry={weightEntry} />
+            </QueryClientProvider>
+        );
+        const submitButton = screen.getByRole('button', { name: 'submit' });
+
+        // Assert
+        expect(submitButton).toBeInTheDocument();
+        fireEvent.click(submitButton);
+        await waitFor(() => {
+            expect(useEditWeightEntryQuery).toHaveBeenCalled();
+        });
+    });
+
+    test('Creating a new weight entry', async () => {
+
+        // Arrange
+        const user = userEvent.setup();
+        render(
+            <QueryClientProvider client={testQueryClient}>
+                <WeightForm />
+            </QueryClientProvider>
+        );
+
+        const group = screen.getByRole('group', { name: /date/i });
+        const dateInput = within(group).getByRole('textbox', { hidden: true });
+        const weightInput = await screen.findByLabelText('weight');
+        const submitButton = screen.getByRole('button', { name: 'submit' });
+
+        // Act
+        user.type(dateInput, '2022-02-28');
+        user.type(weightInput, '80');
+
+        // Assert
+        expect(dateInput).toBeInTheDocument();
+        expect(weightInput).toBeInTheDocument();
+        expect(submitButton).toBeInTheDocument();
+        await user.click(submitButton);
+        await waitFor(() => {
+            expect(useAddWeightEntryQuery).toHaveBeenCalled();
+        });
+    });
+
+});

package/src/components/BodyWeight/Form/WeightForm.tsx

@@ -0,0 +1,102 @@
+import { Button, Stack, TextField } from "@mui/material";
+import { DateTimePicker, LocalizationProvider } from "@mui/x-date-pickers";
+import { AdapterLuxon } from "@mui/x-date-pickers/AdapterLuxon";
+import { WeightEntry } from "components/BodyWeight/model";
+import { useAddWeightEntryQuery, useBodyWeightQuery, useEditWeightEntryQuery } from "components/BodyWeight/queries";
+import { LoadingPlaceholder } from "components/Core/LoadingWidget/LoadingWidget";
+import { Form, Formik } from "formik";
+import { DateTime } from "luxon";
+import { useState } from 'react';
+import { useTranslation } from "react-i18next";
+import { dateToYYYYMMDD } from "utils/date";
+import * as yup from 'yup';
+
+interface WeightFormProps {
+    weightEntry?: WeightEntry,
+    closeFn?: () => void,
+}
+
+export const WeightForm = ({ weightEntry, closeFn }: WeightFormProps) => {
+
+    const weightEntriesQuery = useBodyWeightQuery();
+    const addWeightQuery = useAddWeightEntryQuery();
+    const editWeightQuery = useEditWeightEntryQuery();
+
+    const [dateValue, setDateValue] = useState<DateTime | null>(weightEntry ? DateTime.fromJSDate(weightEntry.date) : DateTime.now);
+    const [t, i18n] = useTranslation();
+
+    const validationSchema = yup.object({
+        weight: yup
+            .number()
+            .min(30, 'Min weight is 30 kg')
+            .max(300, 'Max weight is 300 kg')
+            .required('Weight field is required'),
+    });
+
+    if (weightEntriesQuery.isLoading) {
+        return <LoadingPlaceholder />;
+    }
+
+    return (
+        (<Formik
+            initialValues={{
+                weight: weightEntry ? weightEntry.weight : 0,
+                date: weightEntry ? dateToYYYYMMDD(weightEntry.date) : dateToYYYYMMDD(new Date()),
+            }}
+            validationSchema={validationSchema}
+            onSubmit={async (values) => {
+
+                // Edit existing weight entry
+                if (weightEntry) {
+                    weightEntry.weight = values.weight;
+                    weightEntry.date = new Date(values.date);
+                    editWeightQuery.mutate(weightEntry);
+
+                    // Create a new weight entry
+                } else {
+                    weightEntry = new WeightEntry(new Date(values.date), values.weight);
+                    addWeightQuery.mutate(weightEntry);
+                }
+
+                if (closeFn) {
+                    closeFn();
+                }
+            }}
+        >
+            {formik => (
+                <Form>
+                    <Stack spacing={2}>
+                        <TextField
+                            fullWidth
+                            id="weight"
+                            label={t('weight')}
+                            error={formik.touched.weight && Boolean(formik.touched.weight)}
+                            helperText={formik.touched.weight && formik.errors.weight}
+                            {...formik.getFieldProps('weight')}
+                        />
+
+                        <LocalizationProvider dateAdapter={AdapterLuxon} adapterLocale={i18n.language}>
+                            <DateTimePicker
+                                label={t('date')}
+                                value={dateValue}
+                                slotProps={{ textField: { variant: 'outlined' } }}
+                                disableFuture={true}
+                                onChange={(newValue) => {
+                                    if (newValue) {
+                                        formik.setFieldValue('date', newValue.toJSDate());
+                                    }
+                                    setDateValue(newValue);
+                                }}
+                            />
+                        </LocalizationProvider>
+                        <Stack direction="row" justifyContent="end" sx={{ mt: 2 }}>
+                            <Button color="primary" variant="contained" type="submit" sx={{ mt: 2 }}>
+                                {t('submit')}
+                            </Button>
+                        </Stack>
+                    </Stack>
+                </Form>
+            )}
+        </Formik>)
+    );
+};

package/src/components/BodyWeight/Table/ActionButton/ActionButton.test.tsx

@@ -0,0 +1,65 @@
+import { QueryClientProvider } from "@tanstack/react-query";
+import { fireEvent, render, screen } from '@testing-library/react';
+import { WeightEntry } from "components/BodyWeight/model";
+import { ActionButton } from 'components/BodyWeight/Table/ActionButton/ActionButton';
+import React from 'react';
+import { testQueryClient } from "tests/queryClient";
+
+describe("Body weight test", () => {
+
+    test('renders without crashing', async () => {
+
+        // Arrange
+        //
+        const entry = new WeightEntry(new Date('2021-12-10'), 80, 1);
+        render(
+            <QueryClientProvider client={testQueryClient}>
+                <ActionButton weight={entry} />
+            </QueryClientProvider>
+        );
+
+        // Act
+        //
+        // Note that MUI renders the menu in a different point in the DOM so they are
+        // not present before clicking the button
+        const button = screen.getByRole("button");
+        const editButton = screen.queryByText("edit");
+        const deleteButton = screen.queryByText("delete");
+        const menuElement = screen.queryByRole('menu');
+
+        // Assert
+        //
+        expect(button).toBeInTheDocument();
+        expect(deleteButton).toBeNull();
+        expect(editButton).toBeNull();
+        expect(menuElement).toBeNull();
+
+    });
+
+    test('should have list of actions hidden', async () => {
+        // Arrange
+        //
+        const entry = new WeightEntry(new Date('2021-12-10'), 80, 1);
+
+        // Act
+        //
+        render(
+            <QueryClientProvider client={testQueryClient}>
+                <ActionButton weight={entry} />
+            </QueryClientProvider>
+        );
+        const button = screen.getByRole('button');
+        expect(button).toBeInTheDocument();
+        fireEvent.click(button);
+
+        // Assert
+        //
+        const editButton = await screen.findByText("edit");
+        const deleteButton = await screen.findByText("delete");
+        const menuElement = screen.getByRole('menu');
+        expect(deleteButton).toBeTruthy();
+        expect(editButton).toBeTruthy();
+        expect(menuElement).toBeInTheDocument();
+    });
+
+});

package/src/components/BodyWeight/Table/ActionButton/ActionButton.tsx

@@ -0,0 +1,67 @@
+import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown';
+
+import { Button, Menu, MenuItem } from "@mui/material";
+import { WeightForm } from "components/BodyWeight/Form/WeightForm";
+import { WeightEntry } from "components/BodyWeight/model";
+import { useDeleteWeightEntryQuery } from "components/BodyWeight/queries";
+import { WgerModal } from "components/Core/Modals/WgerModal";
+import React from 'react';
+import { useTranslation } from "react-i18next";
+
+interface ActionButtonProps {
+    weight: WeightEntry;
+}
+
+export const ActionButton = ({ weight }: ActionButtonProps) => {
+    const deleteWeightEntryQuery = useDeleteWeightEntryQuery();
+
+
+    const [t] = useTranslation();
+    const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
+    const [openModal, setOpenModal] = React.useState(false);
+    const open = Boolean(anchorEl);
+    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
+        setAnchorEl(event.currentTarget);
+    };
+
+    const handleEdit = () => {
+        handleClose();
+        handleOpenModal();
+    };
+
+    const handleClose = () => {
+        setAnchorEl(null);
+    };
+
+    const handleDelete = () => {
+        deleteWeightEntryQuery.mutate(weight.id!);
+        setAnchorEl(null);
+    };
+
+    const handleOpenModal = () => setOpenModal(true);
+    const handleCloseModal = () => setOpenModal(false);
+
+
+    return (
+        <div>
+            <Button onClick={handleClick}>
+                <ArrowDropDownIcon />
+            </Button>
+            <Menu
+                anchorEl={anchorEl}
+                open={open}
+                onClose={handleClose}
+                MenuListProps={{
+                    'aria-labelledby': 'basic-button',
+                }}
+            >
+                <MenuItem onClick={handleEdit}>{t("edit")}</MenuItem>
+                <MenuItem onClick={handleDelete}>{t("delete")}</MenuItem>
+            </Menu>
+
+            <WgerModal title={t('edit')} isOpen={openModal} closeFn={handleCloseModal}>
+                <WeightForm weightEntry={weight} closeFn={handleCloseModal} />
+            </WgerModal>
+        </div>
+    );
+};

package/src/components/BodyWeight/Table/Fab/Fab.tsx

@@ -0,0 +1,35 @@
+import React from 'react';
+import { Fab } from '@mui/material';
+import AddIcon from '@mui/icons-material/Add';
+import { WeightForm } from "components/BodyWeight/Form/WeightForm";
+import { WgerModal } from "components/Core/Modals/WgerModal";
+import { useTranslation } from "react-i18next";
+
+
+export const WeightEntryFab = () => {
+
+    const [t] = useTranslation();
+    const [openModal, setOpenModal] = React.useState(false);
+    const handleOpenModal = () => setOpenModal(true);
+    const handleCloseModal = () => setOpenModal(false);
+
+    return (
+        <div>
+            <Fab
+                color="primary"
+                aria-label="add"
+                onClick={handleOpenModal}
+                sx={{
+                    position: 'fixed',
+                    bottom: '5rem',
+                    right: (theme) => `max(${theme.spacing(2)}, calc((100vw - ${theme.breakpoints.values.lg}px) / 2 + ${theme.spacing(2)}))`,
+                    zIndex: 9,
+                }}>
+                <AddIcon />
+            </Fab>
+            <WgerModal title={t('add')} isOpen={openModal} closeFn={handleCloseModal}>
+                <WeightForm closeFn={handleCloseModal} />
+            </WgerModal>
+        </div>
+    );
+};

package/src/components/BodyWeight/Table/index.test.tsx

@@ -0,0 +1,33 @@
+import { QueryClientProvider } from "@tanstack/react-query";
+import { render, screen } from '@testing-library/react';
+import { WeightEntry } from "components/BodyWeight/model";
+import { BrowserRouter } from "react-router-dom";
+import { testQueryClient } from "tests/queryClient";
+import { WeightTable } from './index';
+
+describe("Body weight test", () => {
+    test('renders without crashing', async () => {
+
+        const weightsData: WeightEntry[] = [
+            new WeightEntry(new Date('2021/12/10'), 80, 1),
+            new WeightEntry(new Date('2021/12/20'), 90, 2),
+        ];
+
+        // since I used context api to provide state, also need it here
+        render(
+            <BrowserRouter>
+                <QueryClientProvider client={testQueryClient}>
+                    <WeightTable weights={weightsData} />
+                </QueryClientProvider>
+            </BrowserRouter>
+        );
+
+
+        // Both weights are found in th document
+        const weightRow = await screen.findByText('80');
+        expect(weightRow).toBeInTheDocument();
+
+        const weightRow2 = await screen.findByText("90");
+        expect(weightRow2).toBeInTheDocument();
+    });
+});