\n \n
\n \n Page not found \n \n
\n
\n );\n}\n\nexport default PageNotfound;\n","import React, { createContext, useContext, useState, useEffect } from \"react\";\nimport http from \"../../../../../utils/http\";\nimport { useSelector } from 'react-redux';\nconst DishesCtx = createContext();\n\nexport const useDishes = () => useContext(DishesCtx);\n\nfunction DishesContext({ children, ...props }) {\n const companyId = useSelector(state => state.companyConfig.company_id);\n const [dishes, setDishes] = useState([]);\n useEffect(() => {\n const fetchDishes = async () => {\n let payload;\n try {\n const response = await http.get(`gastro/${companyId}/menu`, {\n params: {\n empty_categories: false,\n }\n });\n payload = response.data.payload;\n } catch (error) {\n console.error(\"Not able to fetch menu\", error);\n }\n if (payload) {\n const categories = [];\n for (const category in payload) {\n payload[category].key = category;\n categories.push(payload[category]);\n }\n setDishes(categories);\n }\n }\n fetchDishes();\n }, []);\n\n return \n {(impressum || dataProtection) && (\n \n {impressum && (\n \n Impressum\n \n )}\n {impressum && dataProtection && \n Datenschutz\n \n )}\n \n )}\n \n {footerBegin}{\" \"}\n \n \n {privacyPolicy}\n \n {\" \"}\n {footerEnd}.{\" \"}\n window.CC.showSettings()}\n // Prevent clicking on Preview Mode\n style={{ pointerEvents: isPreview ? \"none\" : \"auto\" }}\n >\n Cookie-Einstellungen\n \n \n
\n );\n};\n\nexport default Disclaimer;\n","import React from 'react';\nimport dsgvo from \"../../../../../static/certifications/white-background/dsgvo_cert.png\";\nimport hostedInGermany from \"../../../../../static/certifications/white-background/hosted_in_germany.png\";\n\nfunction Certifications(props) {\n return (\n \n 
\n 
\n
\n );\n}\n\nexport default Certifications;\n","import React from \"react\";\nimport Certifications from \"../Certifications\";\n\nfunction CoverLoading({ logo, ...props }) {\n return (\n \n
\n );\n}\n\nexport default CoverLoading;\n","import React from \"react\";\nimport { Helmet } from \"react-helmet\";\n\nconst SEOPreMenuPage = ({ companyName, canonical, companyLogo }) => (\n \n
\n {logo}
\n \n
\n \n \n
\n );\n};\n\nconst LinkButtonType = ({\n internalTypes,\n aLink,\n index,\n linkAddress,\n linksList,\n icon,\n isPreview = false,\n}) => {\n let target = internalTypes.indexOf(aLink.type) >= 0 ? \"\" : \"_blank\";\n let href = linkAddress;\n if (aLink.chat_with_pdf) {\n target = \"_self\";\n href = `/public/welcome/form/ai?cid=${aLink.id}&file=${linkAddress}`;\n }\n return (\n \n \n
\n \n )\n })}\n \n Read more,\n }}\n >\n {hubSubtitle}\n \n
);\n return null;\n };\n\n \n\n return (\n {!isPreview && (\n <>\n \n {/*\n Some classes are defined in tabet.scss and content.scss\n */}\n {(logo && showCoverLoading) && }\n \n )}\n
);\n}\n\nexport default PreMenu;\n","import * as React from \"react\"\n\nconst DeFlag = (props) => (\n \n)\n\nexport default DeFlag\n","import * as React from \"react\"\n\nconst GbFlag = (props) => (\n \n)\n\nexport default GbFlag\n","import * as React from \"react\";\n\n\nconst ItFlag = (props) => (\n \n)\n\nexport default ItFlag;\n","import * as React from \"react\";\n\n\nconst FrFlag = (props) => (\n \n)\n\nexport default FrFlag;\n","import * as React from \"react\";\n\n\nconst NlFlag = (props) => (\n\n)\n\nexport default NlFlag;\n","import { DownOutlined, FlagFilled } from \"@ant-design/icons\";\nimport { Dropdown, Menu, Space } from \"antd\";\nimport React, { useEffect, useState } from \"react\";\nimport DeFlag from \"../../../../../static/flags/de\";\nimport GbFlag from \"../../../../../static/flags/gb\";\nimport ItFlag from \"../../../../../static/flags/it\";\nimport FrFlag from \"../../../../../static/flags/fr\";\nimport NlFlag from \"../../../../../static/flags/nl\";\n\n\nfunction GoogleTranslator(props) {\n const originalLanguage = 'de'\n const [currLang, setCurrLang] = useState(originalLanguage);\n const langFlags = {\n 'de': \n
\n \n
\n \n { isPreview ? null :
\n \n {generateLogo(logo)}\n
\n \n
\n \n\n \n {hubTitle}\n \n \n {name}\n \n
\n \n {enableContactDownload &&\n
\n \n \n
}\n\n \n \n
\n \n
\n \n \n
\n \n 
\n
\n )\n } else {\n return null;\n }\n}\n\nexport default ClientLogo;\n","import { defineMessages } from \"react-intl\";\n\nexport const PasswordResetTranslations = defineMessages({\n passwordResetSuccess: {\n id: \"PasswordReset.Success.Message\",\n defaultMessage: \"Sie haben Ihr Passwort erfolgreich geändert!\",\n },\n forgotPassword: {\n id: \"PasswordReset.Forgot.Text\",\n defaultMessage: \"Passwort vergessen?\",\n },\n subtitle: {\n id: \"PasswordReset.Sucess.Subtitle\",\n defaultMessage: \"Bitte melden Sie sich erneut an.\",\n },\n goToLogin: {\n id: \"PasswordReset.Success.Button\",\n defaultMessage: \"Zur Anmeldeseite gehen\",\n },\n passwordResetGenericError: {\n id: \"PasswordReset.Error.Message\",\n defaultMessage:\n \"Ein unerwarteter Fehler ist aufgetreten, bitte versuchen Sie es erneut oder kontaktieren Sie den Welcomy Kundensupport\",\n },\n passwordResetLengthError: {\n id: \"PasswordReset.Form.Action.Password.Error\",\n defaultMessage: \"Sie müssen zwischen 8 und 36 Zeichen verwenden.\",\n },\n tokenError: {\n id: \"PasswordReset.Form.Action.Token.Error\",\n defaultMessage:\n \"Ihr Token is ungültig, versuchen Sie es sp6ater noch einmal oder wenden Sie sich an den Welcomy Support.\",\n },\n title: {\n id: \"PasswordReset.Form.Title\",\n defaultMessage: \"Geben Sie die E-Mail-Adresse Ihres Welcomy-Kontos an.\",\n },\n submitError: {\n id: \"PasswordReset.Form.Action.Email.Error\",\n defaultMessage:\n \"Die angegebenen E-Mail-Adresse konnte keinem Welcomy-Konto zugeordnet werden.\",\n },\n submitSuccess: {\n id: \"PasswordReset.Form.Action.Email.Success\",\n defaultMessage:\n \"Wir haben Ihnen eine E-Mail zum Zurücksetzen des Passworts gesendet.\",\n },\n emailPlaceholder: {\n id: \"PasswordReset.Form.Action.Email.Text\",\n defaultMessage: \"E-mail-Adresse\",\n },\n inputNewPassword: {\n id: \"PasswordReset.Form.Input.NewPassword\",\n defaultMessage: \"Neues Passwort\",\n },\n inputRepeatPassword: {\n id: \"PasswordReset.Form.Input.RepeatNewPassword\",\n defaultMessage: \"Passwort wiederholen\",\n },\n passwordMatchError: {\n id: \"PasswordReset.Form.Error.Match\",\n defaultMessage: \"Passwörter sind nicht übereinstimmend.\",\n },\n saveButton: {\n id: \"PasswordReset.Form.Save\",\n defaultMessage: \"Neues Passwort speichern\",\n },\n pageTitle: {\n id: \"PasswordReset.Page.Title\",\n defaultMessage: \"Passwort zurücksetzen\",\n },\n});\n","import React, { Component } from \"react\";\nimport { connect } from \"react-redux\";\nimport { withRouter } from \"react-router-dom\";\nimport PasswordChecklist from \"react-password-checklist\"\n\nimport { configSetter } from \"../../redux/actions\";\nimport http from \"../../utils/http\";\nimport \"./login.scss\";\nimport Logo from '../../static/Logo';\nimport { getIntl } from \"../../utils/intl\";\n\nimport { Row, Col, Button, Typography, Alert, Space, Input } from \"antd\";\nimport { getCookie } from \"../../components/getCookie\";\nimport { cookieDomain } from \"../../utils/envs\";\nimport BusinessImageSrc from \"../../static/login-screen/screen.png\";\n\nimport { CheckCircleFilled } from '@ant-design/icons';\n\nimport ClientLogo from \"./ClientLogo\";\nimport { PasswordResetTranslations } from \"../PasswordReset/translations\";\n\nconst { Title, Text, Paragraph } = Typography;\n\nconst BusinessImg = () => (\n \n
\n);\n\n// All of the verticals are now returning the same image for the right part of the\n// screen. This is to be more concise with our new B2B branding approach.\n// This logic will be kept in place in case we want to change the captured\n// screens in the future tho.\nconst BackgroundImage = ({vertical_id}) => {\n if (vertical_id) {\n switch (vertical_id) {\n case 1:\n return \n \n \n e.preventDefault()} trigger=\"click\">\n \n \n
\n \n \n <FormattedMessage id=\"Corona.Title\"\n defaultMessage=\"COVID-19 Infektionsmeldung\">\n </FormattedMessage>\n \n \n
\n \n \n \n \n \n \n \n \n \n \n
\n \n \n \n \n \n \n \n value ? Promise.resolve() : Promise.reject(new Error(agreementRequired)),\n },\n ]}\n >\n \n agreement, agb: AGBs}}\n />\n \n \n \n \n \n \n \n
\n \n
\n
\n );\n}\n\nexport default ReportEmergency;","import http from '../../utils/http';\n\nconst assignPublicCookie = async (company_id, callback) => {\n if (company_id) {\n const response = await http.get(`/company/${company_id}/assign_token`);\n if (callback) {\n callback(response);\n }\n }\n}\n\n\nexport { assignPublicCookie };\n","import { Button, Col, Form, Input, Result, Row, Typography } from 'antd';\nimport React, { useEffect, useState } from 'react';\nimport { useSelector } from 'react-redux';\nimport { useHistory } from 'react-router';\nimport http from '../../utils/http';\nimport { assignPublicCookie } from '../Utils/cookies';\n\nconst { Title, Paragraph } = Typography;\n\n\nconst UnsubscribeForm = ({ companyName, onFinish }) => {\n const validateMessages = {\n required: 'E-mail ist ein Pflichtfeld',\n types: {\n email: 'E-mail ist keine valide E-mail',\n },\n };\n\n return (\n <>\n \n \n \n\n }\n \n
\n
\n );\n}\n\nexport default UnsubscribePage;","import React, { useEffect, useRef, useState } from \"react\";\nimport { Button, Col, Form, Input, Result, Row, Typography } from \"antd\";\nimport { useQuery } from \"../../hooks/useQuery\";\nimport Logo from \"../../static/Logo\";\nimport { useForm } from \"antd/lib/form/Form\";\nimport http from \"../../utils/http\";\nimport { useHistory } from \"react-router-dom\";\nimport { getIntl } from \"../../utils/intl\";\nimport { PasswordResetTranslations as messages} from \"./translations\";\n\nconst { Title, Paragraph } = Typography;\n\nfunction PasswordReset(props) {\n const tokenRef = useRef(null);\n const [tokenError, setTokenError] = useState(null);\n const [passwordSuccess, setPasswordSuccess] = useState(false);\n const [passwordError, setPasswordError] = useState(null);\n const query = useQuery();\n const history = useHistory();\n const [form] = useForm();\n const translation = getIntl();\n\n\n useEffect(() => {\n const token = query.get(\"tk\");\n if (!token) {\n setTokenError(\n translation.formatMessage(messages.tokenError)\n );\n } else {\n tokenRef.current = token;\n }\n }, []);\n\n const submitPassword = async () => {\n const { newPassword, repeatNewPassword } = form.getFieldsValue();\n\n if (newPassword !== repeatNewPassword) {\n setPasswordError(translation.formatMessage(messages.passwordMatchError));\n } else {\n setPasswordError(null);\n try {\n const result = await http.post(\"/auth/reset_password\", {\n password: newPassword,\n token: tokenRef.current,\n });\n\n if (result.status >= 200 && result.status <= 299) {\n setPasswordSuccess(true);\n }\n } catch (error) {\n if (error?.response?.data?.error) {\n const { password: passwordErrorMessage } = error.response.data.error;\n if (passwordErrorMessage === \"Length must be between 8 and 36.\") {\n setPasswordError(translation.formatMessage(messages.passwordResetLengthError));\n } else {\n setPasswordError(passwordErrorMessage);\n }\n } else {\n setPasswordError(\n translation.formatMessage(messages.passwordResetGenericError)\n );\n }\n }\n }\n };\n\n return (\n \n
\n \n \n {translation.formatMessage(messages.pageTitle)} \n {tokenError && (\n {tokenError} \n )}\n {!tokenError && !passwordSuccess && (\n \n \n \n \n \n \n \n {passwordError && (\n {passwordError} \n )}\n \n \n )}\n {!tokenError && passwordSuccess && (\n history.push(\"/login\")}>\n {translation.formatMessage(messages.goToLogin)}\n \n }\n />\n )}\n
\n \n
\n Server down
}\n \n \n \n \n <FormattedMessage\n id=\"SetupPage.Modal.Title\"\n defaultMessage=\"Ihr individueller QR Code wird generiert\"\n ></FormattedMessage>\n \n \n \n \n \n \n
\n );\n}\n\nexport default QrCodeLoadingModal;\n","import { DoubleLeftOutlined, PlusSquareOutlined } from \"@ant-design/icons\";\nimport { Button, Cascader, Col, Row, Space, Divider } from \"antd\";\nimport React from \"react\";\nimport { useSelector } from \"react-redux\";\nimport { cookieDomain, isAllSuperAccount } from \"../../utils/envs\";\nimport { getIntl } from \"../../utils/intl\";\nimport { getCookie } from \"../getCookie\";\n\nfunction AccountSelector({ options = [], accounts = {}, ...props }) {\n const intl = getIntl();\n const _options = [...options];\n\n const companyId = useSelector((state) => state.companyConfig.company_id);\n const verticalId = useSelector((state) => state.companyConfig.vertical_id);\n const name = useSelector((state) => state.companyConfig.name);\n const superAccount = useSelector(\n (state) => state.companyConfig.super_account\n );\n const userRole = getCookie(\"_ur\");\n const superPath = getCookie(\"_super_path\");\n const isAdmin = userRole === 'admin';\n const isSuperAccount = isAllSuperAccount(superAccount);\n\n const SubAccountsText = intl.formatMessage({\n id: \"SideMenu.SubMenu.Subaccounts.placeholder\",\n defaultMessage: \"Bitte wählen\",\n });\n\n const accountSeletorTitle = intl.formatMessage({\n id: \"SideMenu.SubMenu.Subaccounts.Title\",\n defaultMessage: \"Hub auswählen\",\n });\n\n const subAccountBackButton = intl.formatMessage({\n id: \"SideMenu.SubMenu.Subaccounts.Button.Back\",\n defaultMessage: \"Zur Accountübersicht\",\n });\n\n\n \n const changeToAccount = (selectedAccount, _, toMainAccount = false) => {\n const domain = cookieDomain();\n const _selectedAccount = selectedAccount[0];\n const cookieChange = (accountData) => {\n document.cookie = `_c=${accountData.id};domain=${domain};path=/;`;\n document.cookie = `_v=${accountData.vertical};domain=${domain};path=/;`;\n if (isSuperAccount) {\n document.cookie = `_super_name=${name};domain=${domain};path=/;`;\n /**\n * Subdomains cannot be multilevel in order for this to work (multiple dots).\n */\n document.cookie = `_super_path=${\n window.location.hostname.split(\".\")[0]\n };domain=${domain};path=/;`;\n document.cookie = `_super_c=${companyId};domain=${domain};path=/;`;\n document.cookie = `_super_v=${verticalId};domain=${domain};path=/;`;\n } else {\n document.cookie = `_super_name=${name};path=/;domain=${domain};expires=Thu, 01 Jan 1970 00:00:01 GMT`;\n /**\n * Subdomains cannot be multilevel in order for this to work (multiple dots).\n */\n document.cookie = `_super_path=${\n window.location.hostname.split(\".\")[0]\n };domain=${domain};expires=Thu, 01 Jan 1970 00:00:01 GMT;path=/;`;\n document.cookie = `_super_c=${companyId};path=/;domain=${domain};expires=Thu, 01 Jan 1970 00:00:01 GMT`;\n document.cookie = `_super_v=${verticalId};path=/;domain=${domain};expires=Thu, 01 Jan 1970 00:00:01 GMT`;\n }\n let path = 'dashboard';\n if (toMainAccount){\n path = 'dashboard/sub-accounts'\n }\n if (domain === \".localhost.com\") {\n window.location = `http://${accountData.path}.localhost.com:3000/${path}`;\n } else {\n window.location = `http://${accountData.path}.welcomyapp.com/${path}`;\n }\n }\n\n if (toMainAccount) {\n cookieChange(_selectedAccount);\n } else if (accounts[_selectedAccount]) {\n cookieChange(accounts[_selectedAccount]);\n }\n };\n\n\n const backToMainAccount = () => {\n const superName = getCookie(\"_super_name\");\n const superPath = getCookie(\"_super_path\");\n const superId = getCookie(\"_super_c\");\n const superVertical = getCookie(\"_super_v\");\n changeToAccount(\n [{\n name: superName,\n id: superId,\n vertical: superVertical,\n path: superPath,\n }], {}, true);\n };\n if (superAccount === null) return null;\n else if (isSuperAccount && isAdmin) {\n return (\n \n
\n \n \n { props.children }\n \n
\n );\n}\n\nexport default ModalWrapper;","import jsPDF from \"jspdf\";\nimport QRtemplate from \"../../static/qr_code_template.png\";\nimport { getIntl } from \"../../utils/intl\";\nimport { displayNotification } from \"../Notification\";\nimport http from \"../../utils/http\";\n\n\nconst getBase64 = (img, callback) => {\n const reader = new FileReader();\n reader.addEventListener(\"load\", () => callback(reader.result));\n reader.readAsDataURL(img);\n}\n\nexport const newDimensions = (width, height, maxWidth=50, maxHeight=50) => {\n let ratio = 0; // Used for aspect ratio\n\n let newWidth = width, newHeight = height;\n\n // Check if the current width is larger than the max\n if(width > maxWidth){\n ratio = maxWidth / width; // get ratio for scaling image\n newWidth = maxWidth; // Set new width\n newHeight = height * ratio; // Scale height based on ratio\n\n height = height * ratio; // Reset height to match scaled image\n width = width * ratio; // Reset width to match scaled image\n }\n\n // Check if current height is larger than max\n if(height > maxHeight){\n ratio = maxHeight / height; // get ratio for scaling image\n newHeight = maxHeight; // Set new height\n newWidth = width * ratio; // Scale width based on ratio\n\n width = width * ratio; // Reset width to match scaled image\n height = height * ratio; // Reset height to match scaled image\n }\n return [ parseInt(newWidth.toFixed(0)), parseInt(newHeight.toFixed(0))];\n\n} \n\n\n /**\n * Conserve aspect ratio of the original region. Useful when shrinking/enlarging\n * images to fit into a certain area.\n *\n * @param {Number} srcWidth width of source image\n * @param {Number} srcHeight height of source image\n * @param {Number} maxWidth maximum available width\n * @param {Number} maxHeight maximum available height\n * @return {Object} { width, height }\n */\n export const calculateAspectRatioFit = (srcWidth, srcHeight, maxWidth, maxHeight) => {\n\n var ratio = Math.min(maxWidth / srcWidth, maxHeight / srcHeight);\n\n return { width: srcWidth*ratio, height: srcHeight*ratio };\n}\n\n\nexport const generateQRCodeTemplate = async (company_logo, short_link, toggleLoading) => {\n const intl = getIntl();\n\n toggleLoading();\n let logo;\n try {\n logo = await http.get(company_logo, {\n responseType: \"blob\",\n });\n\n // QR CODE is hidden in the DOM in order to make it work.\n const canvas = document.getElementById(\"qr-code-to-pdf\");\n const qrDraw = canvas.toDataURL(\"image/jpeg\", 1);\n\n // Default export is a4 paper, portrait, using millimeters for units\n const mime = logo.data.type;\n getBase64(logo.data, (b64) => {\n let img = new Image();\n img.onload = function () {\n const [logoWidth, logoHeight] = newDimensions(\n img.width,\n img.height,\n 40,\n 40\n );\n const [qrWidth, qrHeight] = newDimensions(800, 800, 180, 240);\n\n const doc = new jsPDF();\n doc.addImage(QRtemplate, \"PNG\", 0, 0, 210, 297);\n\n doc.addImage(img, mime, 105 - logoWidth / 2, 25, logoWidth, logoHeight);\n doc.addImage(\n qrDraw,\n \"image/jpeg\",\n 105 - qrWidth / 2,\n 70,\n qrWidth,\n qrHeight\n );\n if (short_link) {\n doc.setFont(\"Helvetica\", \"normal\", \"normal\");\n doc.setFontSize(28);\n doc.text(\"Oder nutzen Sie den folgenden Link:\", 27, qrHeight + 81);\n doc.setFont(\"Helvetica\", \"bold\");\n doc.text(short_link, 50, qrHeight + 95);\n }\n doc.save(\"Welcomy - QR Code.pdf\");\n toggleLoading();\n };\n\n img.src = b64;\n });\n } catch (error) {\n const errorTitle = intl.formatMessage({\n id: \"Error\",\n defaultMessage: \"Etwas ist schief gelaufen!\",\n });\n console.log(error);\n toggleLoading(false);\n displayNotification(\"error\", errorTitle, \"\");\n }\n};\n\nexport const generateSimpleQrCode = async () => {\n // QR CODE is hidden in the DOM in order to make it work.\n const canvas = document.getElementById(\"qr-code-to-pdf\");\n const qrDraw = canvas.toDataURL(\"image/jpeg\", 1);\n const [qrWidth, qrHeight] = newDimensions(400, 400, 80, 140);\n\n const doc = new jsPDF();\n doc.addImage(\n qrDraw,\n \"image/jpeg\",\n 105 - qrWidth / 2,\n 70,\n qrWidth,\n qrHeight\n );\n\n doc.save(\"Welcomy - QR Code.pdf\");\n\n};\n\n\n\n","import { calculateAspectRatioFit, newDimensions } from \"../../QrCode\";\n\n/**\n * THIS WILL DELETE EVERYTHING PREVIOUSLY DRAWN TO THE CANVAS\n *\n * MAKE SURE TO GET THE CORRECT SIZE AND POSITIONS BEFORE PUTTING CONTENT\n * TO THE CANVAS!!\n */\nexport const getFontSizeCanvas = (\n ctx,\n text,\n textAreaWidth = 60,\n canvasWidth = 150,\n canvasHeight = 200\n) => {\n ctx.clearRect(0, 0, canvasWidth, canvasHeight);\n\n // Initial font size\n var fontSize = 100;\n\n // Set a maximum number of iterations to prevent infinite loop\n var maxIterations = 100;\n var iteration = 0;\n\n // Loop until the text fits in the text area\n while (iteration < maxIterations) {\n ctx.font = \"bold \" + fontSize + \"px Arial\";\n\n // Measure the width of the text\n var textWidth = ctx.measureText(text).width;\n if (textWidth <= textAreaWidth) {\n // If text fits, break out of the loop\n break;\n }\n\n // Decrease font size and try again\n fontSize--;\n iteration++;\n }\n\n // Draw the text\n // ctx.fillText(text, posWidth, posHeight);\n return fontSize;\n};\n\nexport const drawBusinessCardPreview = (\n type,\n canvasBoundries,\n shortLink,\n ctx,\n CARDS_BGS,\n companyLogo,\n logoSize,\n background\n) => {\n // setting up qr code\n const canvasQr = document.getElementById(`qr-template-${type}`);\n\n const qrWidth = 80;\n const qrHeight = 80;\n const qrTop = 25;\n\n const qrX = (canvasBoundries.x - qrWidth) / 2;\n const qrY = qrTop;\n\n let txtTop = qrTop + qrHeight;\n if (shortLink) {\n // Set up short URL text\n ctx.fillStyle = CARDS_BGS[type].fg;\n ctx.textAlign = \"left\";\n ctx.textBaseline = \"middle\";\n\n /**\n * THIS WILL DELETE EVERYTHING PREVIOUSLY DRAWN TO THE CANVAS\n */\n const fontSize = getFontSizeCanvas(\n ctx,\n shortLink,\n qrWidth,\n canvasBoundries.x,\n canvasBoundries.y\n );\n ctx.font = `bold ${fontSize}px Arial`;\n const textMetrics = ctx.measureText(shortLink);\n const txtHeight =\n textMetrics.actualBoundingBoxAscent +\n textMetrics.actualBoundingBoxDescent;\n txtTop += txtHeight;\n const textX = (canvasBoundries.x - textMetrics.width) / 2;\n\n // Set up company logo\n const logo = new Image();\n logo.crossOrigin = \"anonymous\";\n logo.src = companyLogo;\n logo.onload = () => {\n const [logoWidth, logoHeight] = newDimensions(\n logoSize.width ? logoSize.width : logo.naturalWidth,\n logoSize.height ? logoSize.height : logo.naturalHeight,\n logoSize.maxWidth,\n logoSize.maxHeight\n );\n\n const logoTop = txtTop + 20;\n const logoX = (canvasBoundries.x - logoWidth) / 2;\n ctx.drawImage(background, 0, 0, canvasBoundries.x, canvasBoundries.y);\n ctx.drawImage(canvasQr, qrX, qrY, qrWidth, qrHeight);\n ctx.fillText(shortLink, textX, txtTop);\n ctx.drawImage(logo, logoX, logoTop, logoWidth, logoHeight);\n };\n }\n};\n\nexport const drawBusinessCardForDownload = (\n type,\n canvasBoundries,\n shortLink,\n ctx,\n CARDS_BGS,\n companyLogo,\n logoSize,\n background,\n callback\n) => {\n // setting up qr code\n const canvasQr = document.getElementById(`qr-template-${type}`);\n\n const qrWidth = 700;\n const qrHeight = 700;\n const qrTop = 250;\n\n const qrX = (canvasBoundries.x - qrWidth) / 2;\n const qrY = qrTop;\n\n let txtTop = qrTop + qrHeight;\n if (shortLink) {\n // Set up short URL text\n ctx.fillStyle = CARDS_BGS[type].fg;\n ctx.textAlign = \"left\";\n ctx.textBaseline = \"middle\";\n\n /**\n * THIS WILL DELETE EVERYTHING PREVIOUSLY DRAWN TO THE CANVAS\n */\n const fontSize = getFontSizeCanvas(\n ctx,\n shortLink,\n qrWidth,\n canvasBoundries.x,\n canvasBoundries.y\n );\n ctx.font = `bold ${fontSize}px Arial`;\n const textMetrics = ctx.measureText(shortLink);\n const txtHeight =\n textMetrics.actualBoundingBoxAscent +\n textMetrics.actualBoundingBoxDescent;\n txtTop += txtHeight;\n const textX = (canvasBoundries.x - textMetrics.width) / 2;\n\n // Set up company logo\n const logo = new Image();\n logo.crossOrigin = \"anonymous\";\n logo.src = companyLogo;\n logo.onload = () => {\n const { width: logoWidth, height: logoHeight } = calculateAspectRatioFit(\n logo.naturalWidth,\n logo.naturalHeight,\n logoSize.maxWidth,\n logoSize.maxHeight\n );\n\n const logoTop = txtTop + 200;\n const logoX = (canvasBoundries.x - logoWidth) / 2;\n ctx.drawImage(background, 0, 0, canvasBoundries.x, canvasBoundries.y);\n ctx.drawImage(canvasQr, qrX, qrY, qrWidth, qrHeight);\n ctx.fillText(shortLink, textX, txtTop);\n ctx.drawImage(logo, logoX, logoTop, logoWidth, logoHeight);\n\n if (callback) callback();\n };\n }\n};\n","import { newDimensions } from \"../../QrCode\";\n\nimport vcardDarkBg from \"../../../static/vcard-bgs/grey-a8a8a8.png\";\nimport vcardWhiteBg from \"../../../static/vcard-bgs/white-f1f1f1.png\";\nimport {\n drawBusinessCardForDownload,\n drawBusinessCardPreview,\n} from \"../draw/draw\";\n\nexport const CARDS_BGS = {\n QR_CODE_WHITE_CARD: { image: vcardWhiteBg, bg: \"transparent\", fg: \"#000\" },\n QR_CODE_DARK_CARD: { image: vcardDarkBg, bg: \"transparent\", fg: \"#F9F9F9\" },\n};\n\nconst ORIGINAL_BG_DIMENSIONS = {\n // in pixels\n width: 1109,\n height: 1720,\n};\n\nexport const qrCodeVCardRender = (\n ctx,\n canvas,\n type,\n companyLogo,\n shortLink,\n canvasBoundries,\n logoSize = {\n maxWidth: 50,\n maxHeight: 50,\n },\n preview = true,\n callback\n) => {\n const backgroundUrl = CARDS_BGS[type].image;\n const background = new Image();\n background.src = backgroundUrl;\n // setting up card background\n background.onload = () => {\n if (preview) {\n drawBusinessCardPreview(\n type,\n canvasBoundries,\n shortLink,\n ctx,\n CARDS_BGS,\n companyLogo,\n logoSize,\n background\n );\n } else {\n drawBusinessCardForDownload(\n type,\n canvasBoundries,\n shortLink,\n ctx,\n CARDS_BGS,\n companyLogo,\n logoSize,\n background,\n callback\n );\n }\n };\n};\n\nexport const downloadPngQRCode = (callback) => {\n const canvasQr = document.getElementById(\"qr-code-to-pdf\");\n const [qrWidth, qrHeight] = newDimensions(800, 800, 600, 600);\n const qrX = (800 - qrWidth) / 2;\n const qrY = (800 - qrHeight) / 2;\n const newCanvas = document.createElement(\"canvas\");\n const ctx = newCanvas.getContext(\"2d\");\n newCanvas.width = 800;\n newCanvas.height = 800;\n ctx.drawImage(canvasQr, qrX, qrY, qrWidth, qrHeight);\n\n const newImageUrl = newCanvas.toDataURL(\"image/png\", 1.0);\n\n const link = document.createElement(\"a\");\n link.href = newImageUrl;\n link.download = \"myqr.png\";\n link.click();\n link.remove();\n newCanvas.remove();\n\n if (callback) {\n callback();\n }\n};\n\nexport const downloadVCardQrCode = (type, companyLogo, shortLink, callback) => {\n const newCanvas = document.createElement(\"canvas\");\n const ctx = newCanvas.getContext(\"2d\");\n newCanvas.width = ORIGINAL_BG_DIMENSIONS.width;\n newCanvas.height = ORIGINAL_BG_DIMENSIONS.height;\n\n const _download = () => {\n const newImageUrl = newCanvas.toDataURL(\"image/png\", 1.0);\n const link = document.createElement(\"a\");\n link.href = newImageUrl;\n link.download = \"myVCard.png\";\n link.click();\n link.remove();\n newCanvas.remove();\n };\n\n qrCodeVCardRender(\n ctx,\n newCanvas,\n type,\n companyLogo,\n shortLink,\n { x: ORIGINAL_BG_DIMENSIONS.width, y: ORIGINAL_BG_DIMENSIONS.height },\n { maxWidth: 450, maxHeight: 450 },\n false,\n _download\n );\n if (callback) {\n callback();\n }\n};\n","import QRcode from \"qrcode.react\";\nimport React, { useEffect, useRef } from \"react\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { qrCodeExportTrigger } from \"../../redux/actions/qrCodeExport\";\nimport { newDimensions } from \"../QrCode\";\nimport { QR_CODE_PNG_TRANSPARENT_BG } from \"./QRCodePicker\";\n\nimport {\n CARDS_BGS,\n downloadPngQRCode,\n downloadVCardQrCode,\n qrCodeVCardRender,\n} from \"./qr-code/QrCodeUtils\";\n\nconst MINI_CANVAS_SIZE = { x: 150, y: 200 };\nconst MINI_CANVAS_BOUNDRIES = { x: 145, y: 195 };\n\nconst useCanvas = (callback) => {\n const canvasRef = useRef(null);\n\n useEffect(() => {\n const canvas = canvasRef.current;\n const ctx = canvas.getContext(\"2d\");\n callback([canvas, ctx]);\n }, []);\n\n return canvasRef;\n};\n\nconst QrTemplate = ({ type, ...props }) => {\n const dispatch = useDispatch();\n const downloadTrigger = useSelector(\n (state) => state.qrCodeExportConfig.qrCodeExportTrigger\n );\n const selectedQrType = useSelector(\n (state) => state.qrCodeExportConfig.selectedQrExportType\n );\n const shortLink = useSelector((state) => state.companyConfig.short_link);\n const companyLogo = useSelector((state) => state.hubConfig.company_logo);\n const hubLogo = useSelector((state) => state.hubConfig.hubLogo);\n\n const logo = hubLogo || companyLogo;\n\n const canvasRef = useCanvas(([canvas, ctx]) => {\n if (Object.keys(CARDS_BGS).indexOf(type) > -1) {\n qrCodeVCardRender(\n ctx,\n canvas,\n type,\n logo,\n shortLink,\n MINI_CANVAS_BOUNDRIES\n );\n } else {\n const canvasQr = document.getElementById(\"qr-code-to-pdf\");\n const [qrWidth, qrHeight] = newDimensions(400, 400, 80, 80);\n const qrX = (MINI_CANVAS_SIZE.x - qrWidth) / 2;\n const qrY = (MINI_CANVAS_SIZE.y - qrHeight) / 2;\n ctx.drawImage(canvasQr, qrX, qrY, qrWidth, qrHeight);\n }\n });\n\n useEffect(() => {\n if (downloadTrigger && selectedQrType === type) {\n downloadQr();\n }\n }, [downloadTrigger]);\n\n const downloadQr = () => {\n if (selectedQrType === QR_CODE_PNG_TRANSPARENT_BG) {\n downloadPngQRCode(() => {\n dispatch(qrCodeExportTrigger(false));\n });\n }\n\n if (Object.keys(CARDS_BGS).indexOf(selectedQrType) > -1) {\n downloadVCardQrCode(selectedQrType, logo, shortLink, () => {\n dispatch(qrCodeExportTrigger(false));\n });\n }\n };\n\n if (type) {\n return (\n \n {type !== QR_CODE_PNG_TRANSPARENT_BG && (\n
\n );\n }\n\n return null;\n};\n\nexport default QrTemplate;\n","\nimport { defineMessages } from 'react-intl';\n\nexport const qrModalStrings = defineMessages({\n title: {\n id: \"QrDownload.Modal.Title\",\n defaultMessage: \"Wähle Sie Ihr gewünschtes Dateiformat\",\n },\n disclaimer: {\n id: \"QrDownload.Modal.Subtitle\",\n defaultMessage: \"Laden Sie eine PNG-Datei mit transparentem Hintergrund herunter, wenn Sie diese eigenständig in Ihre Projekte implementieren möchten, oder entscheiden Sie sich für den Download einer Welcomy Karte, welche den QR-Code, Kurz-URL und Logo Ihrer Hub in einem eleganten Design vereint.\",\n },\n pngTitle: {\n id: \"QrDownload.Modal.PNG.Title\",\n defaultMessage: \"QR-Code\",\n },\n pngSubtitle: {\n id: \"QrDownload.Modal.PNG.Subtitle\",\n defaultMessage: \"Datei mit transparentem Hintergrund im PNG-Format. Implementieren Sie diesen in Ihre Projekte und Designideen.\",\n },\n cardLightTitle: {\n id: \"QrDownload.Modal.CardLight.Title\",\n defaultMessage: \"Welcomy Karte - hell\",\n },\n cardLightSubtitle: {\n id: \"QrDownload.Modal.CardLight.Subtitle\",\n defaultMessage: \"Eine virtuelle Visitenkarte, die Sie als Hintergrundbild für den Sperrbildschirm Ihres Telefons verwenden können.\",\n },\n cardDarkTitle: {\n id: \"QrDownload.Modal.CardDark.Title\",\n defaultMessage: \"Welcomy Karte - dunkel\",\n },\n cardDarkSubtitle: {\n id: \"QrDownload.Modal.CardDark.Subtitle\",\n defaultMessage: \"Eine virtuelle Visitenkarte, die Sie als Hintergrundbild für den Sperrbildschirm Ihres Telefons verwenden können.\",\n },\n cancel: {\n id: \"Cancel\",\n defaultMessage: \"Abbrechen\",\n },\n});\n","import { Col, Radio, Row, Typography } from \"antd\";\nimport React from \"react\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { qrCodeExportTrigger, selectQrExportType } from \"../../redux/actions/qrCodeExport\";\nimport { getIntl } from \"../../utils/intl\";\nimport ModalWrapper from \"../Modal\";\nimport QrTemplate from \"./QrTemplate\";\nimport { qrModalStrings as translations } from './Translations';\n\nconst { Title, Paragraph } = Typography;\n\nexport const QR_CODE_PNG_TRANSPARENT_BG = \"QR_CODE_PNG_TRANSPARENT_BG\";\nexport const QR_CODE_WHITE_CARD = \"QR_CODE_WHITE_CARD\";\nexport const QR_CODE_DARK_CARD = \"QR_CODE_DARK_CARD\";\nexport const QR_CODE_ORANGE_CARD = \"QR_CODE_ORANGE_CARD\";\n\nconst QRCodePicker = ({changeQrModalVisibility, ...props}) => {\n const translate = getIntl();\n const qrCodeSelectedType = useSelector(\n (state) => state.qrCodeExportConfig.selectedQrExportType\n );\n const modalOpen = useSelector(\n (state) => state.qrCodeExportConfig.modalOpen\n );\n const dispatch = useDispatch();\n\n const setExportType = (type) => {\n dispatch(selectQrExportType(type));\n };\n\n return (\n \n {translate.formatMessage(translations.title)} \n \n {translate.formatMessage(translations.disclaimer)}\n \n \n \n
\n \n setExportType(QR_CODE_PNG_TRANSPARENT_BG)}\n />\n \n
\n \n \n {translate.formatMessage(translations.pngTitle)}\n \n \n
\n \n \n {translate.formatMessage(translations.pngSubtitle)}\n \n \n
\n \n \n
\n \n setExportType(QR_CODE_WHITE_CARD)}\n />\n
\n \n \n {translate.formatMessage(translations.cardLightTitle)}\n \n \n
\n \n \n {translate.formatMessage(translations.cardLightSubtitle)}\n \n \n
\n \n \n
\n \n setExportType(QR_CODE_DARK_CARD)}\n />\n \n
\n \n \n {translate.formatMessage(translations.cardDarkTitle)}\n \n \n
\n \n \n {translate.formatMessage(translations.cardDarkSubtitle)}\n \n \n
\n \n
\n
\n \n );\n};\n\nexport default QRCodePicker;\n","\nimport { defineMessages } from 'react-intl';\n\nexport const messages = defineMessages({\n downloadText: {\n id: \"SideMenu.Cards.Download.Text\",\n defaultMessage: \"Hub-Zugang herunterladen:\",\n },\n downloadSubtext: {\n id: \"SideMenu.Cards.Download.Subtext\",\n defaultMessage: \"QR-Code\",\n },\n downloadAction: {\n id: \"SideMenu.Cards.Download.Action\",\n defaultMessage: \"Herunterladen\",\n },\n copyText: {\n id: \"SideMenu.Cards.Copy.Text\",\n defaultMessage: \"Hub-Zugang kopieren:\",\n },\n copySubtext: {\n id: \"SideMenu.Cards.Copy.Subtext\",\n defaultMessage: \"Kurz URL\",\n },\n copyAction: {\n id: \"SideMenu.Cards.Copy.Action\",\n defaultMessage: \"Kopieren\",\n },\n copyActionSuccess: {\n id: \"SideMenu.Cards.Copy.Action.Success\",\n defaultMessage: \"Kopiert!\",\n },\n copyActionError: {\n id: \"SideMenu.Cards.Copy.Action.Error\",\n defaultMessage: \"Die Kurz-URL konnte nicht kopiert werden, bitte kontaktieren Sie den Support!\",\n },\n\n // WHEN COPY COMMAND IS NOT ALLOWED IN BROWSER\n copyGenerateBtn: {\n id: \"SideMenu.QuickAcions.ShortUrl.Generate\",\n defaultMessage: \"Anzeigen\",\n },\n modalCloseBtn: {\n id: \"SideMenu.QuickAcions.Modal.ShortUrl.Close\",\n defaultMessage: \"Schließen\",\n },\n modalDisclaimer: {\n id: \"SideMenu.QuickAcions.Modal.ShortUrl.Disclaimer\",\n defaultMessage: \"Teilen Sie diese personalisierte URL mit Ihren Nutzern, um auf den Hub zuzugreifen, ohne einen QR-Code zu scannen.\",\n },\n modalTitle: {\n id: \"SideMenu.QuickAcions.Modal.ShortUrl.Title\",\n defaultMessage: \"Die Kurz-URL der Hub\",\n },\n});\n","import { LoadingOutlined } from \"@ant-design/icons\";\nimport { Button, Modal, Spin, Typography, message } from \"antd\";\nimport React, { useEffect, useState } from \"react\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { qrCodeExportModalOpen } from \"../../../redux/actions/qrCodeExport\";\nimport { getIntl } from \"../../../utils/intl\";\nimport { generateQRCodeTemplate } from \"../../QrCode\";\nimport { messages } from \"./translations\";\n\nconst { Paragraph, Title } = Typography;\n\nfunction ActionCards() {\n const dispatch = useDispatch();\n const companyLogo = useSelector((state) => state.companyConfig.company_logo);\n const hubLogo = useSelector((state) => state.hubConfig.hubLogo);\n const shortLink = useSelector((state) => state.companyConfig.short_link);\n const verticalId = useSelector((state) => state.companyConfig.vertical_id);\n const modalOpen = useSelector((state) => state.qrCodeExportConfig.modalOpen);\n\n const [shortUrlModalOpen, setShortUrlModalOpen] = useState(false);\n\n const IS_BROWSER_CLIPBOARD_ALLOWED = navigator.clipboard;\n\n const logo = hubLogo || companyLogo;\n\n const [isLoadingQr, setIsLoadingQr] = useState(false);\n\n const translation = getIntl();\n\n const generateQrCode = () => {\n if (verticalId === 4) {\n changeQrModalVisibility();\n } else {\n // Backwards compability with restaurants, check useEffect.\n setIsLoadingQr(true);\n }\n };\n\n // Trigger QR Code download for restaurants as they use a different\n // template for now.\n useEffect(() => {\n if (isLoadingQr) {\n generateQRCodeTemplate(logo, shortLink, () =>\n setTimeout(() => {\n setIsLoadingQr(false);\n }, 2500)\n );\n }\n }, [isLoadingQr]);\n\n const changeQrModalVisibility = () => {\n dispatch(qrCodeExportModalOpen(!modalOpen));\n };\n\n const copyShortUrl = () => {\n if (shortLink) {\n /**\n * We tried copying the url to the clipboard but that presented\n * itself as tricky across browsers so we decided to default\n * to just displaying the url to the user and let them manually copy it.\n */\n setShortUrlModalOpen(true);\n }\n };\n\n return (\n <>\n \n
\n \n \n {translation.formatMessage(messages.downloadText)}\n \n \n {translation.formatMessage(messages.downloadSubtext)}\n \n {!isLoadingQr ? (\n \n ) : (\n
\n \n
\n \n \n {translation.formatMessage(messages.copyText)}\n \n \n {translation.formatMessage(messages.copySubtext)}\n \n \n
\n \n \n {translation.formatMessage(messages.modalTitle)}\n \n \n {translation.formatMessage(messages.modalDisclaimer)}\n \n \n {shortLink}\n \n
\n \n \n );\n}\n\nexport default ActionCards;\n","import {\n DeploymentUnitOutlined,\n FolderOutlined,\n SettingOutlined,\n UserOutlined,\n LineChartOutlined,\n BankOutlined,\n} from \"@ant-design/icons\";\nimport { Alert, Col, Menu, Row, Space } from \"antd\";\nimport QRcode from \"qrcode.react\";\nimport React, { Component } from \"react\";\nimport { FormattedMessage, injectIntl } from \"react-intl\";\nimport { connect } from \"react-redux\";\nimport { withRouter } from \"react-router-dom\";\nimport Logo from \"../../static/Logo\";\nimport WelcomyIcon from \"../../static/WelcomyIcon\";\nimport { isAllSuperAccount } from \"../../utils/envs\";\nimport QrCodeLoadingModal from \"../QrCode/QrCodeLoadingModal\";\nimport AccountSelector from \"./AccountSelector\";\nimport QRCodePicker from \"./QRCodePicker\";\nimport { qrCodeExportModalOpen } from \"../../redux/actions/qrCodeExport\";\nimport ActionCards from \"./action-cards/ActionCards\";\n\nconst { SubMenu } = Menu;\n\nclass SideMenu extends Component {\n // submenu keys of first level\n rootSubmenuKeys = [\n \"welcomytools\",\n \"office\",\n \"usermanagement\",\n \"welcomyHub\",\n \"analytics\",\n \"compliance\",\n \"workspaces\",\n \"myCompany\"\n ];\n constructor(props) {\n super(props);\n this.routes = {\n workspaces: {\n 2: \"/workspaces\",\n },\n welcomyHub: {\n 20: \"/\",\n 21: \"/hub/config\",\n 22: \"/sub-accounts\",\n },\n welcomytools: {\n 12: \"/subscriptions\",\n 13: \"/digital-menu\",\n 14: \"/print-menu\",\n },\n office: {\n 6: \"/employees\",\n },\n usermanagement: {\n 200: \"/user-management\",\n },\n compliance: {\n 10: \"/impressum\",\n 101: \"/data-protection\",\n },\n analytics: {\n 25: \"/hub/analytics\",\n },\n myCompany: {\n 30: \"/company-setup\",\n },\n };\n this.short_link = props?.companyConfig?.short_link;\n this.qrRef = React.createRef();\n this.state = {\n defaultSelectedKey: props?.companyConfig?.super_account ? ['22'] : ['20'],\n selectedKey: [],\n openKeys: [],\n rootSubmenuKeys: [\n (\n \"welcomytools\",\n \"office\",\n \"usermanagement\",\n \"welcomyHub\",\n \"analytics\",\n \"compliance\",\n \"analytics\",\n \"myCompany\"\n ),\n ],\n tolltipCopyIsOpen: false,\n isLoadingQR: false,\n };\n\n this.copiedUrlMessage = (\n \n \n \n \n \n
\n \n \n \n \n \n }\n >\n {isAllSuperAccount(this.props.companyConfig.super_account) && (\n \n \n \n )}\n \n \n \n \n \n \n \n \n \n \n \n }\n >\n \n \n \n \n \n \n \n \n \n \n \n \n }\n >\n {(verticalId === 3 || verticalId === 4) && (\n \n \n \n )}\n {(verticalId === 3 || verticalId === 4) && (\n \n \n )}\n {(verticalId === 3 || verticalId === 4) && (\n \n \n \n )}\n \n \n \n \n \n }\n >\n \n \n \n \n\n \n \n \n \n }\n >\n \n \n \n \n {verticalId === 1 && (\n \n \n \n \n }\n >\n \n \n \n \n )}\n \n \n \n \n }\n >\n \n \n \n \n
\n );\n }\n}\n\nconst mapStateToProps = (state) => {\n return {\n companyConfig: state.companyConfig,\n modalOpen: state.qrCodeExportConfig.modalOpen,\n };\n};\n\nexport default withRouter(connect(mapStateToProps)(injectIntl(SideMenu)));\n","import React, { Component } from \"react\";\nimport { Typography, Avatar, Row, Col, Dropdown, Menu } from \"antd\";\nimport { GlobalOutlined } from '@ant-design/icons';\nimport { withRouter } from \"react-router-dom\";\nimport { connect } from \"react-redux\";\nimport { configSetter } from \"../../redux/actions\";\nimport { LanguagePickerConsumer } from '../LanguagePicker.jsx';\nimport { getIntl } from \"../../utils/intl\";\nimport http from '../../utils/http';\nimport { cookieDomain, isAllSuperAccount } from \"../../utils/envs\";\nimport { getCookie } from \"../getCookie\";\n\nconst { Text } = Typography;\n\n\nclass Navbar extends Component {\n constructor(props) {\n super(props);\n this.state = {\n supportedLanguages: {},\n }\n const intl = getIntl();\n const logoutText = intl.formatMessage(\n {\n id: \"Navbar.Logout\",\n defaultMessage: \"Abmelden\"\n }\n );\n const backToMainAccountText = intl.formatMessage(\n {\n id: \"Navbar.Accounts.Back\",\n defaultMessage: \"Zum Hauptaccount\"\n }\n );\n this.logo = props.companyConfig.company_logo;\n this.name = props.companyConfig.name;\n this.superAccount = this.props.companyConfig.super_account;\n const superPath = getCookie(\"_super_path\");\n this.menu = (\n \n );\n this.languages = (\n \n \n {this.state.tolltipCopyIsOpen && (\n \n
\n \n \n \n
\n
\n );\n }\n}\n\nconst mapStateToProps = (state) => {\n return {\n companyConfig: state.companyConfig,\n layoutConfig: state.layoutConfig,\n };\n};\n\nexport default withRouter(connect(mapStateToProps)(Navbar));\n","import React, { useState, useEffect } from 'react';\nimport moment from \"moment\";\nimport { useSelector } from 'react-redux';\nimport { FormattedMessage } from 'react-intl';\nimport {\n Breadcrumb,\n Button,\n Col,\n Row,\n Table,\n Tag,\n Typography,\n } from \"antd\";\n\nimport http from '../../utils/http';\nimport { displayNotification } from '../../components/Notification';\nimport { getIntl } from \"../../utils/intl\";\n\nimport Modal from '../../components/Modal';\n\nconst { Title, Paragraph } = Typography;\n\nfunction CoronaAlerts(props) {\n const company_id = useSelector((state) => state.companyConfig.company_id);\n const [notifyModal, setNotifyModal] = useState(false);\n const [verifyModal, setVerifyModal] = useState(false);\n const [newAlerts, setNewAlerts] = useState([]);\n const [oldAlerts, setOldAlerts] = useState([]);\n\n const [toVerify, setToVerify] = useState(null);\n\n const intl = getIntl();\n\n useEffect(() => {\n fetchAlerts()\n }, [company_id]);\n\n const fetchAlerts = async () => {\n if (company_id) {\n\n try {\n const response = await http.get(`/company/${company_id}/emergencies`);\n\n if (response.status === 200) {\n const alerts = response.data.payload;\n setNewAlerts(alerts.active_emergencies);\n setOldAlerts(alerts.past_emergencies);\n } else {\n const title = intl.formatMessage({\n id: \"Error\",\n defaultMessage: \"Etwas ist schief gelaufen!\",\n });\n const body = intl.formatMessage({\n id: \"AlertPage.Notification.Error\",\n defaultMessage: \"Not able to retrieve alerts from server.\",\n });\n displayNotification(\"error\", title, body);\n }\n } catch (error) {\n const title = intl.formatMessage({\n id: \"Error\",\n defaultMessage: \"Etwas ist schief gelaufen!\",\n });\n const body = intl.formatMessage({\n id: \"AlertPage.Notification.Error\",\n defaultMessage: \"Not able to retrieve alerts from server.\",\n });\n displayNotification(\"error\", title, body);\n }\n }\n };\n\n const verifyAlert = async () => {\n try {\n const response = await http.put(`/company/${company_id}/emergency/${toVerify.id}`, {\n verified: true,\n });\n\n if (response.status === 204) {\n const title = intl.formatMessage({\n id: 'Success',\n defaultMessage: 'Erfolg!',\n });\n const body = intl.formatMessage({\n id: 'AlertPage.Notification.Verify.Success',\n defaultMessage: 'Zeitlich relevante Aufenthaltsorte der Person wurden über Ihre Meldungsbestätigung informiert.',\n });\n displayNotification('success', title, body);\n fetchAlerts();\n } else {\n const title = intl.formatMessage({\n id: 'Error',\n defaultMessage: 'Etwas ist schief gelaufen!',\n });\n const body = intl.formatMessage({\n id: 'AlertPage.Notification.Verify.Error',\n defaultMessage: 'Meldung konnte nicht bestätigt werden, versuchen Sie es später noch einmal.',\n });\n displayNotification('error', title, body);\n }\n setVerifyModal(false);\n } catch (error) {\n setVerifyModal(false);\n const title = intl.formatMessage({\n id: \"Error\",\n defaultMessage: \"Etwas ist schief gelaufen!\",\n });\n const body = intl.formatMessage({\n id: 'AlertPage.Notification.Verify.Error',\n defaultMessage: 'Meldung konnte nicht bestätigt werden, versuchen Sie es später noch einmal.',\n });\n displayNotification('error', title, body);\n }\n }\n\n const resolveAlert = async (alert) => {\n try {\n const response = await http.put(`/company/${company_id}/emergency/${alert.id}`, {\n resolved: true,\n });\n\n if (response.status === 204) {\n const title = intl.formatMessage({\n id: 'Success',\n defaultMessage: 'Erfolg!',\n });\n const body = intl.formatMessage({\n id: 'AlertPage.Notification.Resolve.Success',\n defaultMessage: 'Diese Meldung wurde als gelöst markiert und in der Rubrik \"Bearbeitete Meldungen\" verschoben',\n });\n displayNotification('success', title, body);\n fetchAlerts();\n } else {\n const title = intl.formatMessage({\n id: 'Error',\n defaultMessage: 'Etwas ist schief gelaufen!',\n });\n const body = intl.formatMessage({\n id: 'AlertPage.Notification.Resolve.Error',\n defaultMessage: \"Meldung konnte nicht als gelöst markiert werden, versuchen Sie es später noch einmal\",\n });\n displayNotification('error', title, body);\n }\n } catch (error) {\n const title = intl.formatMessage({\n id: 'Error',\n defaultMessage: 'Etwas ist schief gelaufen!',\n });\n const body = intl.formatMessage({\n id: 'AlertPage.Notification.Resolve.Error',\n defaultMessage: \"Meldung konnte nicht als gelöst markiert werden, versuchen Sie es später noch einmal\",\n });\n displayNotification('error', title, body);\n }\n }\n\n const dismissAlert = async (alert) => {\n try {\n const response = await http.put(`/company/${company_id}/emergency/${alert.id}`, {\n dismissed: true,\n });\n\n if (response.status === 204) {\n const title = intl.formatMessage({\n id: 'Success',\n defaultMessage: 'Erfolg!',\n });\n const body = intl.formatMessage({\n id: 'AlertPage.Notification.Dismiss.Success',\n defaultMessage: 'Die Meldung wurde als \"verworfen\" markiert und in der Rubrik \"Bearbeitete Meldungen\" verschoben.',\n });\n displayNotification('success', title, body);\n fetchAlerts();\n } else {\n const title = intl.formatMessage({\n id: 'Error',\n defaultMessage: 'Etwas ist schief gelaufen!',\n });\n const body = intl.formatMessage({\n id: 'AlertPage.Notification.Dismiss.Error',\n defaultMessage: 'Meldung konnte nicht als gelöst markiert werden, versuchen Sie es später noch einmal',\n });\n displayNotification('error', title, body);\n }\n } catch (error) {\n const title = intl.formatMessage({\n id: 'Error',\n defaultMessage: 'Etwas ist schief gelaufen!',\n });\n const body = intl.formatMessage({\n id: 'AlertPage.Notification.Dismiss.Error',\n defaultMessage: 'Meldung konnte nicht als gelöst markiert werden, versuchen Sie es später noch einmal',\n });\n displayNotification('error', title, body);\n }\n }\n\n const verified = (\n <>\n \n {this.props.isTop}\n e.preventDefault()}>\n \n \n e.preventDefault()}>\n \n
\n \n \n {\n setVerifyModal(false);\n setToVerify(null);\n }}\n >\n \n {verifyModalBody}, network: {welcomyNetwork}, you: you, confirmed: confirmed}}\n >\n \n \n \n \n \n \n \">\n \n \n \n \n \n \n \n \n \n \n
\n \n \n <FormattedMessage\n id=\"AlertPage.Title\"\n defaultMessage=\"Meldungsbereich\"\n ></FormattedMessage>\n \n \n
\n \n \n <FormattedMessage\n id=\"AlertPage.Subtitle.Alerts.New\"\n defaultMessage=\"Neue Meldungen\"\n ></FormattedMessage>\n \n \n
\n \n \n \n \n
| \n \n \n \n {dish.description} \n | \n \n | \n {price !== \"default\" && {price}}\n | \n {`${Number(\n dish.dish_price[price]\n )?.toFixed(2)} €`} | \n |
\n
\n \n \n Allergene Informationen\n \n
\n {\n allergens\n .map((al, index) => {\n if (!al.is_preservative)\n return ({`${al.id}. ${al.name}${index + 1 !== totalAllergens ? `, `: ``}`}
);\n })\n }\n \n \n \n \n {pageTitle}\n \n \n
\n \n
\n \n \n \n \n \n \n \n \n \n \n Check all\n \n \n \n \n \n
\n \n
\n \n \n \n
\n
\n );\n}\n\nfunction PrintMenu(props) {\n return (\n \n \n
\n
\n );\n}\n\nexport default Subscriptions;\n","export default (toDownload, fileName) => {\n const blob = new Blob([toDownload], { type: \"octet/stream\" });\n const url = window.URL.createObjectURL(blob);\n const link = document.createElement(\"a\");\n\n link.setAttribute(\"href\", url);\n link.setAttribute(\"download\", `${fileName}-welcomy.csv`);\n document.body.appendChild(link); // Required for FF\n\n link.click();\n window.URL.revokeObjectURL(url);\n};","const editorTheme = {\n ltr: \"ltr\",\n rtl: \"rtl\",\n placeholder: \"editor-placeholder\",\n paragraph: \"editor-paragraph\",\n quote: \"editor-quote\",\n heading: {\n h1: \"editor-heading-h1\",\n h2: \"editor-heading-h2\",\n h3: \"editor-heading-h3\",\n h4: \"editor-heading-h4\",\n h5: \"editor-heading-h5\"\n },\n list: {\n nested: {\n listitem: \"editor-nested-listitem\"\n },\n ol: \"editor-list-ol\",\n ul: \"editor-list-ul\",\n listitem: \"editor-listitem\"\n },\n image: \"editor-image\",\n link: \"editor-link\",\n text: {\n bold: \"editor-text-bold\",\n italic: \"editor-text-italic\",\n overflowed: \"editor-text-overflowed\",\n hashtag: \"editor-text-hashtag\",\n underline: \"editor-text-underline\",\n strikethrough: \"editor-text-strikethrough\",\n underlineStrikethrough: \"editor-text-underlineStrikethrough\",\n code: \"editor-text-code\"\n },\n code: \"editor-code\",\n codeHighlight: {\n atrule: \"editor-tokenAttr\",\n attr: \"editor-tokenAttr\",\n boolean: \"editor-tokenProperty\",\n builtin: \"editor-tokenSelector\",\n cdata: \"editor-tokenComment\",\n char: \"editor-tokenSelector\",\n class: \"editor-tokenFunction\",\n \"class-name\": \"editor-tokenFunction\",\n comment: \"editor-tokenComment\",\n constant: \"editor-tokenProperty\",\n deleted: \"editor-tokenProperty\",\n doctype: \"editor-tokenComment\",\n entity: \"editor-tokenOperator\",\n function: \"editor-tokenFunction\",\n important: \"editor-tokenVariable\",\n inserted: \"editor-tokenSelector\",\n keyword: \"editor-tokenAttr\",\n namespace: \"editor-tokenVariable\",\n number: \"editor-tokenProperty\",\n operator: \"editor-tokenOperator\",\n prolog: \"editor-tokenComment\",\n property: \"editor-tokenProperty\",\n punctuation: \"editor-tokenPunctuation\",\n regex: \"editor-tokenVariable\",\n selector: \"editor-tokenSelector\",\n string: \"editor-tokenSelector\",\n symbol: \"editor-tokenProperty\",\n tag: \"editor-tokenProperty\",\n url: \"editor-tokenOperator\",\n variable: \"editor-tokenVariable\"\n }\n};\n\nexport default editorTheme;\n","import React from 'react';\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport {\n CAN_REDO_COMMAND,\n CAN_UNDO_COMMAND,\n REDO_COMMAND,\n UNDO_COMMAND,\n SELECTION_CHANGE_COMMAND,\n FORMAT_TEXT_COMMAND,\n FORMAT_ELEMENT_COMMAND,\n $getSelection,\n $isRangeSelection,\n $createParagraphNode,\n $getNodeByKey\n} from \"lexical\";\nimport { $isLinkNode, TOGGLE_LINK_COMMAND } from \"@lexical/link\";\nimport {\n $isParentElementRTL,\n $wrapLeafNodesInElements,\n $isAtNodeEnd\n} from \"@lexical/selection\";\nimport { $getNearestNodeOfType, mergeRegister } from \"@lexical/utils\";\nimport {\n INSERT_ORDERED_LIST_COMMAND,\n INSERT_UNORDERED_LIST_COMMAND,\n REMOVE_LIST_COMMAND,\n $isListNode,\n ListNode\n} from \"@lexical/list\";\nimport { createPortal } from \"react-dom\";\nimport {\n $createHeadingNode,\n $createQuoteNode,\n $isHeadingNode\n} from \"@lexical/rich-text\";\nimport {\n $createCodeNode,\n $isCodeNode,\n getDefaultCodeLanguage,\n getCodeLanguages\n} from \"@lexical/code\";\nimport { useDispatch, useSelector } from 'react-redux';\nimport { setRichDocumentSaved } from \"../../../redux/actions\";\nimport { getIntl } from '../../../utils/intl';\n\nconst LowPriority = 1;\n\nconst supportedBlockTypes = new Set([\n \"paragraph\",\n \"quote\",\n \"code\",\n \"h1\",\n \"h2\",\n \"ul\",\n \"ol\"\n]);\n\nconst blockTypeToBlockName = {\n code: \"Code Block\",\n h1: \"Large Heading\",\n h2: \"Small Heading\",\n h3: \"Heading\",\n h4: \"Heading\",\n h5: \"Heading\",\n ol: \"Numbered List\",\n paragraph: \"Normal\",\n quote: \"Quote\",\n ul: \"Bulleted List\"\n};\n\nfunction Divider() {\n return ;\n}\n\nfunction positionEditorElement(editor, rect) {\n if (rect === null) {\n editor.style.opacity = \"0\";\n editor.style.top = \"-1000px\";\n editor.style.left = \"-1000px\";\n } else {\n editor.style.opacity = \"1\";\n editor.style.top = `${rect.top + rect.height + window.pageYOffset + 10}px`;\n editor.style.left = `${\n rect.left + window.pageXOffset - editor.offsetWidth / 2 + rect.width / 2\n }px`;\n }\n}\n\nfunction FloatingLinkEditor({ editor }) {\n const editorRef = useRef(null);\n const inputRef = useRef(null);\n const mouseDownRef = useRef(false);\n const [linkUrl, setLinkUrl] = useState(\"\");\n const [isEditMode, setEditMode] = useState(false);\n const [lastSelection, setLastSelection] = useState(null);\n\n const updateLinkEditor = useCallback(() => {\n const selection = $getSelection();\n if ($isRangeSelection(selection)) {\n const node = getSelectedNode(selection);\n const parent = node.getParent();\n if ($isLinkNode(parent)) {\n setLinkUrl(parent.getURL());\n } else if ($isLinkNode(node)) {\n setLinkUrl(node.getURL());\n } else {\n setLinkUrl(\"\");\n }\n }\n const editorElem = editorRef.current;\n const nativeSelection = window.getSelection();\n const activeElement = document.activeElement;\n\n if (editorElem === null) {\n return;\n }\n\n const rootElement = editor.getRootElement();\n if (\n selection !== null &&\n !nativeSelection.isCollapsed &&\n rootElement !== null &&\n rootElement.contains(nativeSelection.anchorNode)\n ) {\n const domRange = nativeSelection.getRangeAt(0);\n let rect;\n if (nativeSelection.anchorNode === rootElement) {\n let inner = rootElement;\n while (inner.firstElementChild != null) {\n inner = inner.firstElementChild;\n }\n rect = inner.getBoundingClientRect();\n } else {\n rect = domRange.getBoundingClientRect();\n }\n\n if (!mouseDownRef.current) {\n positionEditorElement(editorElem, rect);\n }\n setLastSelection(selection);\n } else if (!activeElement || activeElement.className !== \"link-input\") {\n positionEditorElement(editorElem, null);\n setLastSelection(null);\n setEditMode(false);\n setLinkUrl(\"\");\n }\n\n return true;\n }, [editor]);\n\n useEffect(() => {\n return mergeRegister(\n editor.registerUpdateListener(({ editorState }) => {\n editorState.read(() => {\n updateLinkEditor();\n });\n }),\n\n editor.registerCommand(\n SELECTION_CHANGE_COMMAND,\n () => {\n updateLinkEditor();\n return true;\n },\n LowPriority\n )\n );\n }, [editor, updateLinkEditor]);\n\n useEffect(() => {\n editor.getEditorState().read(() => {\n updateLinkEditor();\n });\n }, [editor, updateLinkEditor]);\n\n useEffect(() => {\n if (isEditMode && inputRef.current) {\n inputRef.current.focus();\n }\n }, [isEditMode]);\n\n return (\n \n \n
\n \n
\n \n
\n \n \n {button}\n \n \n
\n \n
\n
\n \n \n
\n \n \n {title} \n
\n \n \n {body} \n
\n \n \n
\n
\n \n \n {isEditMode ? (\n {\n setLinkUrl(event.target.value);\n }}\n onKeyDown={(event) => {\n if (event.key === \"Enter\") {\n event.preventDefault();\n if (lastSelection !== null) {\n if (linkUrl !== \"\") {\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, linkUrl);\n }\n setEditMode(false);\n }\n } else if (event.key === \"Escape\") {\n event.preventDefault();\n setEditMode(false);\n }\n }}\n />\n ) : (\n <>\n
\n );\n}\n\nfunction Select({ onChange, className, options, value }) {\n return (\n \n );\n}\n\nfunction getSelectedNode(selection) {\n const anchor = selection.anchor;\n const focus = selection.focus;\n const anchorNode = selection.anchor.getNode();\n const focusNode = selection.focus.getNode();\n if (anchorNode === focusNode) {\n return anchorNode;\n }\n const isBackward = selection.isBackward();\n if (isBackward) {\n return $isAtNodeEnd(focus) ? anchorNode : focusNode;\n } else {\n return $isAtNodeEnd(anchor) ? focusNode : anchorNode;\n }\n}\n\nfunction BlockOptionsDropdownList({\n editor,\n blockType,\n toolbarRef,\n setShowBlockOptionsDropDown\n}) {\n const dropDownRef = useRef(null);\n\n useEffect(() => {\n const toolbar = toolbarRef.current;\n const dropDown = dropDownRef.current;\n\n if (toolbar !== null && dropDown !== null) {\n const { top, left } = toolbar.getBoundingClientRect();\n dropDown.style.top = `${top + 40}px`;\n dropDown.style.left = `${left}px`;\n }\n }, [dropDownRef, toolbarRef]);\n\n useEffect(() => {\n const dropDown = dropDownRef.current;\n const toolbar = toolbarRef.current;\n\n if (dropDown !== null && toolbar !== null) {\n const handle = (event) => {\n const target = event.target;\n\n if (!dropDown.contains(target) && !toolbar.contains(target)) {\n setShowBlockOptionsDropDown(false);\n }\n };\n document.addEventListener(\"click\", handle);\n\n return () => {\n document.removeEventListener(\"click\", handle);\n };\n }\n }, [dropDownRef, setShowBlockOptionsDropDown, toolbarRef]);\n\n const formatParagraph = () => {\n if (blockType !== \"paragraph\") {\n editor.update(() => {\n const selection = $getSelection();\n\n if ($isRangeSelection(selection)) {\n $wrapLeafNodesInElements(selection, () => $createParagraphNode());\n }\n });\n }\n setShowBlockOptionsDropDown(false);\n };\n\n const formatLargeHeading = () => {\n if (blockType !== \"h1\") {\n editor.update(() => {\n const selection = $getSelection();\n\n if ($isRangeSelection(selection)) {\n $wrapLeafNodesInElements(selection, () => $createHeadingNode(\"h1\"));\n }\n });\n }\n setShowBlockOptionsDropDown(false);\n };\n\n const formatSmallHeading = () => {\n if (blockType !== \"h2\") {\n editor.update(() => {\n const selection = $getSelection();\n\n if ($isRangeSelection(selection)) {\n $wrapLeafNodesInElements(selection, () => $createHeadingNode(\"h2\"));\n }\n });\n }\n setShowBlockOptionsDropDown(false);\n };\n\n const formatBulletList = () => {\n if (blockType !== \"ul\") {\n editor.dispatchCommand(INSERT_UNORDERED_LIST_COMMAND);\n } else {\n editor.dispatchCommand(REMOVE_LIST_COMMAND);\n }\n setShowBlockOptionsDropDown(false);\n };\n\n const formatNumberedList = () => {\n if (blockType !== \"ol\") {\n editor.dispatchCommand(INSERT_ORDERED_LIST_COMMAND);\n } else {\n editor.dispatchCommand(REMOVE_LIST_COMMAND);\n }\n setShowBlockOptionsDropDown(false);\n };\n\n const formatQuote = () => {\n if (blockType !== \"quote\") {\n editor.update(() => {\n const selection = $getSelection();\n\n if ($isRangeSelection(selection)) {\n $wrapLeafNodesInElements(selection, () => $createQuoteNode());\n }\n });\n }\n setShowBlockOptionsDropDown(false);\n };\n\n const formatCode = () => {\n if (blockType !== \"code\") {\n editor.update(() => {\n const selection = $getSelection();\n\n if ($isRangeSelection(selection)) {\n $wrapLeafNodesInElements(selection, () => $createCodeNode());\n }\n });\n }\n setShowBlockOptionsDropDown(false);\n };\n\n return (\n \n \n {linkUrl}\n \n event.preventDefault()}\n onClick={() => {\n setEditMode(true);\n }}\n />\n
\n \n )}\n \n \n \n \n \n \n \n \n
\n );\n}\n\nexport default function Toolbar() {\n const [editor] = useLexicalComposerContext();\n const toolbarRef = useRef(null);\n const [canUndo, setCanUndo] = useState(false);\n const [canRedo, setCanRedo] = useState(false);\n const [blockType, setBlockType] = useState(\"paragraph\");\n const [selectedElementKey, setSelectedElementKey] = useState(null);\n const [showBlockOptionsDropDown, setShowBlockOptionsDropDown] = useState(\n false\n );\n const [codeLanguage, setCodeLanguage] = useState(\"\");\n const [isRTL, setIsRTL] = useState(false);\n const [isLink, setIsLink] = useState(false);\n const [isBold, setIsBold] = useState(false);\n const [isItalic, setIsItalic] = useState(false);\n const [isUnderline, setIsUnderline] = useState(false);\n const [isStrikethrough, setIsStrikethrough] = useState(false);\n const [isCode, setIsCode] = useState(false);\n\n const dispatch = useDispatch();\n const intl = getIntl();\n\n const saveButton = intl.formatMessage({\n id: 'ImpressumPage.Button.Save',\n defaultMessage: 'Dokument speichern', \n });\n\n\n const saveDocument = () => {\n dispatch(setRichDocumentSaved(true));\n }\n\n const updateToolbar = useCallback(() => {\n const selection = $getSelection();\n if ($isRangeSelection(selection)) {\n const anchorNode = selection.anchor.getNode();\n const element =\n anchorNode.getKey() === \"root\"\n ? anchorNode\n : anchorNode.getTopLevelElementOrThrow();\n const elementKey = element.getKey();\n const elementDOM = editor.getElementByKey(elementKey);\n if (elementDOM !== null) {\n setSelectedElementKey(elementKey);\n if ($isListNode(element)) {\n const parentList = $getNearestNodeOfType(anchorNode, ListNode);\n const type = parentList ? parentList.getTag() : element.getTag();\n setBlockType(type);\n } else {\n const type = $isHeadingNode(element)\n ? element.getTag()\n : element.getType();\n setBlockType(type);\n if ($isCodeNode(element)) {\n setCodeLanguage(element.getLanguage() || getDefaultCodeLanguage());\n }\n }\n }\n // Update text format\n setIsBold(selection.hasFormat(\"bold\"));\n setIsItalic(selection.hasFormat(\"italic\"));\n setIsUnderline(selection.hasFormat(\"underline\"));\n setIsStrikethrough(selection.hasFormat(\"strikethrough\"));\n setIsCode(selection.hasFormat(\"code\"));\n setIsRTL($isParentElementRTL(selection));\n\n // Update links\n const node = getSelectedNode(selection);\n const parent = node.getParent();\n if ($isLinkNode(parent) || $isLinkNode(node)) {\n setIsLink(true);\n } else {\n setIsLink(false);\n }\n }\n }, [editor]);\n\n useEffect(() => {\n return mergeRegister(\n editor.registerUpdateListener(({ editorState }) => {\n editorState.read(() => {\n updateToolbar();\n });\n }),\n editor.registerCommand(\n SELECTION_CHANGE_COMMAND,\n (_payload, newEditor) => {\n updateToolbar();\n return false;\n },\n LowPriority\n ),\n editor.registerCommand(\n CAN_UNDO_COMMAND,\n (payload) => {\n setCanUndo(payload);\n return false;\n },\n LowPriority\n ),\n editor.registerCommand(\n CAN_REDO_COMMAND,\n (payload) => {\n setCanRedo(payload);\n return false;\n },\n LowPriority\n )\n );\n }, [editor, updateToolbar]);\n\n const codeLanguges = useMemo(() => getCodeLanguages(), []);\n const onCodeLanguageSelect = useCallback(\n (e) => {\n editor.update(() => {\n if (selectedElementKey !== null) {\n const node = $getNodeByKey(selectedElementKey);\n if ($isCodeNode(node)) {\n node.setLanguage(e.target.value);\n }\n }\n });\n },\n [editor, selectedElementKey]\n );\n\n const insertLink = useCallback(() => {\n if (!isLink) {\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, \"https://\");\n } else {\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, null);\n }\n }, [editor, isLink]);\n\n return (\n \n {\n editor.dispatchCommand(UNDO_COMMAND);\n }}\n className=\"toolbar-item spaced\"\n aria-label=\"Undo\"\n >\n \n \n {\n editor.dispatchCommand(REDO_COMMAND);\n }}\n className=\"toolbar-item\"\n aria-label=\"Redo\"\n >\n \n \n \n setShowBlockOptionsDropDown(!showBlockOptionsDropDown)\n }\n aria-label=\"Formatting Options\"\n >\n \n {blockTypeToBlockName[blockType]}\n \n \n {showBlockOptionsDropDown &&\n createPortal(\n {\n editor.dispatchCommand(FORMAT_TEXT_COMMAND, \"bold\");\n }}\n className={\"toolbar-item spaced \" + (isBold ? \"active\" : \"\")}\n aria-label=\"Format Bold\"\n >\n \n \n {\n editor.dispatchCommand(FORMAT_TEXT_COMMAND, \"italic\");\n }}\n className={\"toolbar-item spaced \" + (isItalic ? \"active\" : \"\")}\n aria-label=\"Format Italics\"\n >\n \n \n {\n editor.dispatchCommand(FORMAT_TEXT_COMMAND, \"underline\");\n }}\n className={\"toolbar-item spaced \" + (isUnderline ? \"active\" : \"\")}\n aria-label=\"Format Underline\"\n >\n \n \n {\n editor.dispatchCommand(FORMAT_TEXT_COMMAND, \"strikethrough\");\n }}\n className={\n \"toolbar-item spaced \" + (isStrikethrough ? \"active\" : \"\")\n }\n aria-label=\"Format Strikethrough\"\n >\n \n \n {\n editor.dispatchCommand(FORMAT_TEXT_COMMAND, \"code\");\n }}\n className={\"toolbar-item spaced \" + (isCode ? \"active\" : \"\")}\n aria-label=\"Insert Code\"\n >\n \n \n \n \n \n {isLink &&\n createPortal( {\n editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, \"left\");\n }}\n className=\"toolbar-item spaced\"\n aria-label=\"Left Align\"\n >\n \n \n {\n editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, \"center\");\n }}\n className=\"toolbar-item spaced\"\n aria-label=\"Center Align\"\n >\n \n \n {\n editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, \"right\");\n }}\n className=\"toolbar-item spaced\"\n aria-label=\"Right Align\"\n >\n \n \n {\n editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, \"justify\");\n }}\n className=\"toolbar-item\"\n aria-label=\"Justify Align\"\n >\n \n {\" \"}\n \n )}\n saveDocument()}\n className=\"toolbar-item toolbar-button\"\n aria-label={saveButton}\n >\n {saveButton}\n {\" \"}\n
\n );\n}\n","import React from 'react';\nimport { $getListDepth, $isListItemNode, $isListNode } from \"@lexical/list\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport {\n $getSelection,\n $isElementNode,\n $isRangeSelection,\n INDENT_CONTENT_COMMAND,\n COMMAND_PRIORITY_HIGH\n} from \"lexical\";\nimport { useEffect } from \"react\";\n\nfunction getElementNodesInSelection(selection) {\n const nodesInSelection = selection.getNodes();\n\n if (nodesInSelection.length === 0) {\n return new Set([\n selection.anchor.getNode().getParentOrThrow(),\n selection.focus.getNode().getParentOrThrow()\n ]);\n }\n\n return new Set(\n nodesInSelection.map((n) => ($isElementNode(n) ? n : n.getParentOrThrow()))\n );\n}\n\nfunction isIndentPermitted(maxDepth) {\n const selection = $getSelection();\n\n if (!$isRangeSelection(selection)) {\n return false;\n }\n\n const elementNodesInSelection = getElementNodesInSelection(selection);\n\n let totalDepth = 0;\n\n for (const elementNode of elementNodesInSelection) {\n if ($isListNode(elementNode)) {\n totalDepth = Math.max($getListDepth(elementNode) + 1, totalDepth);\n } else if ($isListItemNode(elementNode)) {\n const parent = elementNode.getParent();\n if (!$isListNode(parent)) {\n throw new Error(\n \"ListMaxIndentLevelPlugin: A ListItemNode must have a ListNode for a parent.\"\n );\n }\n\n totalDepth = Math.max($getListDepth(parent) + 1, totalDepth);\n }\n }\n\n return totalDepth <= maxDepth;\n}\n\nexport default function ListMaxIndentLevelPlugin({ maxDepth }) {\n const [editor] = useLexicalComposerContext();\n\n useEffect(() => {\n return editor.registerCommand(\n INDENT_CONTENT_COMMAND,\n () => !isIndentPermitted(maxDepth ?? 7),\n COMMAND_PRIORITY_HIGH\n );\n }, [editor, maxDepth]);\n\n return null;\n}\n","import React from 'react';\nimport { registerCodeHighlighting } from \"@lexical/code\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { useEffect } from \"react\";\n\nexport default function CodeHighlightPlugin() {\n const [editor] = useLexicalComposerContext();\n useEffect(() => {\n return registerCodeHighlighting(editor);\n }, [editor]);\n return null;\n}\n","import React from 'react';\nimport { AutoLinkPlugin } from \"@lexical/react/LexicalAutoLinkPlugin\";\n\nconst URL_MATCHER = /((https?:\\/\\/(www\\.)?)|(www\\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\\.[a-zA-Z0-9()]{1,6}\\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;\n\nconst EMAIL_MATCHER = /(([^<>()[\\]\\\\.,;:\\s@\"]+(\\.[^<>()[\\]\\\\.,;:\\s@\"]+)*)|(\".+\"))@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,}))/;\n\nconst MATCHERS = [\n (text) => {\n const match = URL_MATCHER.exec(text);\n return (\n match && {\n index: match.index,\n length: match[0].length,\n text: match[0],\n url: match[0]\n }\n );\n },\n (text) => {\n const match = EMAIL_MATCHER.exec(text);\n return (\n match && {\n index: match.index,\n length: match[0].length,\n text: match[0],\n url: `mailto:${match[0]}`\n }\n );\n }\n];\n\nexport default function PlaygroundAutoLinkPlugin() {\n return Enter some rich text...
;\n}\n\nconst EditorPlugins = ({ initialEditorState, saveDocument}) => {\n let _initialEditorState = initialEditorState;\n const [editor] = useLexicalComposerContext();\n const editorStateRef = useRef();\n const dispatch = useDispatch();\n const companyId = useSelector((state) => state.companyConfig.company_id);\n const shouldSave = useSelector(state => state.editorsConfig.impressumEditor.shouldSave);\n const parser = new DOMParser();\n const intl = getIntl();\n\n const successTitle = intl.formatMessage({\n id: 'Success',\n defaultMessage: 'Erfolg!',\n });\n\n const successBody = intl.formatMessage({\n id: 'ImpressumPage.Notification.Success',\n defaultMessage: 'Dokument wurde erfolgreich gespeichert!',\n });\n\n const errorTitle = intl.formatMessage({\n id: 'Error',\n defaultMessage: 'Etwas ist schief gelaufen!',\n });\n\n const errorBody = intl.formatMessage({\n id: 'ImpressumPage.Notification.Error',\n defaultMessage: 'Das Dokument konnte nicht gespeichert werden. Bitte versuchen Sie es später noch einmal.',\n });\n\n const savePost = async (html) => {\n try {\n const result = await saveDocument(html);\n if (result.status >= 200 && result.status < 300) {\n displayNotification('success', successTitle, successBody);\n }\n } catch (error) {\n console.log(error);\n displayNotification('error', errorTitle, errorBody);\n }\n dispatch(setRichDocumentSaved(false));\n };\n\n useEffect(() => {\n editor.update(() => {\n if (_initialEditorState) {\n const dom = parser.parseFromString(_initialEditorState, \"text/html\");\n const nodes = $generateNodesFromDOM(editor, dom);\n $getRoot().select();\n const selection = $getSelection();\n selection.insertNodes(nodes);\n }\n })\n }, [_initialEditorState])\n\n useEffect(() => {\n if (!!shouldSave) {\n editor.update(() => {\n const htmlString = $generateHtmlFromNodes(editor, null);\n savePost(htmlString)\n });\n }\n }, [shouldSave]);\n\n return (\n \n
\n );\n};\n\nexport default function Editor({ initialEditorState, saveDocument }) {\n const editorConfig = {\n // The editor theme\n theme: EditorTheme,\n // Handling of errors during update\n onError(error) {\n throw error;\n },\n // Any custom nodes go here\n nodes: [\n HeadingNode,\n ListNode,\n ListItemNode,\n QuoteNode,\n CodeNode,\n CodeHighlightNode,\n TableNode,\n TableCellNode,\n TableRowNode,\n AutoLinkNode,\n LinkNode,\n ],\n };\n return (\n \n (editorStateRef.current = editorState)}\n />\n
\n \n \n \n {TitleText} \n \n {BodyText}\n \n \n {NoteText}\n \n \n
\n \n 0 ? impressum : \"\"} saveDocument={saveDocument}/>\n }\n \n
\n \n
\n
\n );\n}\n\nexport default Impressum;","import React, { useEffect, useState } from \"react\";\nimport { Form, Input, Modal } from \"antd\";\nimport { getIntl } from \"../../utils/intl\";\nimport { updateWorkspaceApi } from \"../../api/workspacesApiService\";\nimport { displayNotification } from \"../../components/Notification\";\nimport { useDispatch } from \"react-redux\";\nimport { updateWorkspace } from \"../../redux/actions/companyConfig\";\n\nconst UpdateWorkspaceModal = ({ workspace, onConfirm, onCancel }) => {\n const [form] = Form.useForm();\n const intl = getIntl();\n const [isModalVisible, setIsModalVisible] = useState(false);\n const dispatch = useDispatch();\n\n const successNotificationTitle = intl.formatMessage({\n id: \"Success\",\n defaultMessage: \"Erfolg!\",\n });\n const successNotificationBody = intl.formatMessage({\n id: \"SubAccounts.Notification.Edit.Success\",\n defaultMessage: \"Kundenzugang erfolgreich aktualisiert.\",\n });\n const errorNotificationTitle = intl.formatMessage({\n id: \"SubAccounts.Notification.Edit.Error.Title\",\n defaultMessage: \"Kundenzugang konnte nicht aktualisiert werden.\",\n });\n const errorNotificationBody = intl.formatMessage({\n id: \"SubAccounts.Notification.Edit.Error.Body\",\n });\n const editModalTitle = intl.formatMessage({\n id: \"SubAccounts.Edit.Title\",\n });\n const editInputName = intl.formatMessage({\n id: \"SubAccounts.Edit.Name\",\n });\n const editNamePlaceholder = intl.formatMessage({\n id: \"SubAccounts.Edit.Name.Placeholder\",\n });\n const mandatoryField = intl.formatMessage({\n id: \"Field.Mandatory\",\n });\n\n\n useEffect(() => {\n form.setFieldsValue(workspace);\n setIsModalVisible(!!workspace);\n }, [workspace]);\n\n const handleModalCancel = () => {\n setIsModalVisible(false);\n form.resetFields();\n onCancel();\n };\n\n const handleModalOk = () => {\n updateWorkspaceApi(workspace?.id, form.getFieldsValue())\n .then((res) => {\n dispatch(\n updateWorkspace({\n id: workspace?.id,\n updatedWorkspace: form.getFieldsValue(),\n }),\n );\n setIsModalVisible(false);\n form.resetFields();\n displayNotification(\n \"success\",\n successNotificationTitle,\n successNotificationBody,\n );\n })\n .catch((e) => {\n form.resetFields();\n console.error(e);\n displayNotification(\n \"error\",\n errorNotificationTitle,\n errorNotificationBody,\n );\n });\n };\n\n const validateMessages = {\n required: mandatoryField,\n }\n return (\n <>\n {message}
\n \n );\n};\n\nexport default ConfirmationModal;\n","import React, { useState } from \"react\";\nimport { Avatar, Table, Space, Button, Input, Col } from \"antd\";\nimport \"./Workspaces.scss\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { deleteWorkspaceApi } from \"../../api/workspacesApiService\";\nimport UpdateWorkspaceModal from \"./UpdateWorkspace\";\nimport ConfirmationModal from \"../../components/ConfirmationModal/ConfirmationModal\";\nimport { displayNotification } from \"../../components/Notification\";\nimport { deleteWorkspace } from \"../../redux/actions/companyConfig\";\nimport { getIntl } from \"../../utils/intl\";\nimport { getCookie } from \"../../components/getCookie\";\nimport { cookieDomain, isAllSuperAccount } from \"../../utils/envs\";\n\nconst Workspaces = () => {\n const workspaces = useSelector(\n (state) => state.companyConfig[\"sub_accounts\"],\n );\n const [updateWorkspace, setUpdateWorkspace] = useState(null);\n const [deleteWorkspaceId, setDeleteWorkspaceId] = useState(null);\n const [confirmationModalVisible, setConfirmationModalVisible] =\n useState(false);\n const dispatch = useDispatch();\n const [searchText, setSearchText] = useState(\"\");\n const filteredWorkspaces = workspaces?.filter(\n (item) =>\n item.name.toLowerCase().includes(searchText.toLowerCase()) ||\n item.path.toLowerCase().includes(searchText.toLowerCase()),\n );\n const intl = getIntl();\n const superAccount = useSelector(\n (state) => state.companyConfig.super_account\n );\n const successNotificationTitle = intl.formatMessage({\n id: \"Success\",\n defaultMessage: \"Erfolg!\",\n });\n const successNotificationBody = intl.formatMessage({\n id: \"SubAccounts.Notification.Delete.Success\",\n defaultMessage: \"Kundenzugang wurde erfolgreich gelöscht.\",\n });\n const errorNotificationTitle = intl.formatMessage({\n id: \"SubAccounts.Notification.Delete.Error.Title\",\n defaultMessage: \"Kundenzugang konnte nicht gelöscht werden.\",\n });\n const errorNotificationBody = intl.formatMessage({\n id: \"SubAccounts.Notification.Delete.Error.Body\",\n });\n const searchPlaceholder = intl.formatMessage({\n id: \"SubAccounts.Search.Placeholder\",\n defaultMessage: \"Suche nach Name oder URL\"\n });\n const editButtonText = intl.formatMessage({\n id: \"Edit\",\n });\n const viewButtonText = intl.formatMessage({\n id: \"View\",\n });\n const deleteButtonText = intl.formatMessage({\n id: \"Delete\",\n });\n const confirmationDeleteTitle = intl.formatMessage({\n id: \"SubAccounts.Delete.Title\",\n });\n const confirmationDeleteMessage = intl.formatMessage({\n id: \"SubAccounts.Delete.Message\",\n });\n\n const columns = [\n {\n title: \"Logo\",\n dataIndex: \"id\",\n width: 50,\n maxWidth: 50,\n render: (_, workspace) => {return\n
\n \n );\n};\n\nexport default Workspaces;\n","import React from \"react\";\nimport { Button, Col, Form, Input, Modal, Row, Space, Typography } from \"antd\";\nimport { TeamOutlined } from \"@ant-design/icons\";\nimport { getIntl } from \"../../utils/intl\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { cookieDomain } from \"../../utils/envs\";\nimport { displayNotification } from \"../Notification\";\nimport { createWorkspaceApi } from \"../../api/workspacesApiService\";\nimport { createWorkspaceAction } from \"../../redux/actions/companyConfig\";\n\nconst CreateWorkspaceModal = ({ visible, onCancel }) => {\n const [form] = Form.useForm();\n const intl = getIntl();\n const companyId = useSelector((state) => state.companyConfig.company_id);\n const { Title, Paragraph } = Typography;\n const dispatch = useDispatch();\n const pageTitle = intl.formatMessage({\n id: \"SubAccounts.Title\",\n defaultMessage: \"Neuen Kundenzugang erstellen\",\n });\n\n const pageDescription = intl.formatMessage({\n id: \"SubAccounts.Description\",\n defaultMessage:\n \"Kreieren Sie einen neuen Kundenzugang, indem Sie einen Namen und eine individualisierte URL festlegen. Wir empfehlen Ihnen den Namen Ihres Kunden oder Zielgruppe in der URL zu verwenden, da dieser beim Teilen der Web-App angezeigt wird.\",\n });\n\n const nameInput = intl.formatMessage({\n id: \"SubAccounts.Input.Name\",\n defaultMessage: \"Name des Kundenzugangs\",\n });\n\n const urlInput = intl.formatMessage({\n id: \"SubAccounts.Input.Url\",\n defaultMessage: \"URL des Kundenzugangs\",\n });\n\n const createButton = intl.formatMessage({\n id: \"SubAccounts.Button.Create\",\n defaultMessage: \"Bestätigen\",\n });\n\n const cancelButton = intl.formatMessage({\n id: \"Cancel\",\n defaultMessage: \"Abbrechen\",\n });\n\n const requiredText = intl.formatMessage({\n id: \"Error.Required\",\n defaultMessage: \"Bitte geben Sie die notwendigen Informationen an.\",\n });\n\n const successNotificationTitle = intl.formatMessage({\n id: \"Success\",\n defaultMessage: \"Erfolg!\",\n });\n\n const successNotificationBody = intl.formatMessage({\n id: \"SubAccounts.Notification.Success\",\n defaultMessage: \"Neuer Kundenzugang wurde erfolgreich erstellt.\",\n });\n\n const noSpecialChars = intl.formatMessage({\n id: \"SubAccounts.Error.SpecialChars\",\n defaultMessage: \"Erlaubt sind nur Buchstaben, Zahlen und das Symbol '-'\",\n });\n\n const handleOnCancel = () => {\n onCancel();\n };\n\n const createWorkspace = () => {\n createWorkspaceApi(companyId, form.getFieldsValue()).then((response) => {\n const { access_token, company_id } = response.data.payload;\n if (access_token) {\n const domain = cookieDomain();\n document.cookie = `_a=${access_token};domain=${domain};path=/;`;\n }\n dispatch(\n createWorkspaceAction({\n workspace: { id: company_id, ...form.getFieldsValue() },\n }),\n );\n displayNotification(\n \"success\",\n successNotificationTitle,\n successNotificationBody,\n );\n });\n };\n\n const invalidChars = /[ `!@#$%^&*()_+\\=\\[\\]{};':\"\\\\|,.<>\\/?~]/;\n return (\n \n setSearchText(e.target.value)}\n />\n handleUpdateModalConfirm(e)}\n onCancel={() => setUpdateWorkspace(null)}\n />\n
\n \n \n \n
\n );\n}\n\nexport default SubAccounts;\n","import { Col, Row, Typography } from 'antd';\nimport React, { useEffect, useState } from 'react';\nimport { useSelector } from 'react-redux';\nimport RichEditor from '../../components/RichEditor'\nimport http from '../../utils/http';\nimport { getIntl } from '../../utils/intl';\n\n\nconst { Title, Paragraph } = Typography;\n\nfunction DataProtection(props) {\n const [dataprotection, setDataprotection] = useState('');\n const companyId = useSelector(state => state.companyConfig.company_id);\n const intl = getIntl();\n\n const titleText = intl.formatMessage({\n id: 'DataProtectionPage.Title',\n defaultMessage: 'Datenschutzrichtlinien',\n });\n\n const bodyText = intl.formatMessage({\n id: 'DataProtectionPage.Body',\n defaultMessage: 'Auf dieser Seite können Sie den Texteditor verwenden, um Ihre Datenschutz-Seite zu erstellen.\\n Sie sollten sicherstellen, dass Sie immer die aktuellste Version Ihrer Datenschutzrichtlinien Ihres Unternehmens verwenden.\\n\\n Wichtiger Hinweis: Bitte beachten Sie, dass Ihre Datenschutzrichtlinien erforderlich sind, um die \\n Compliance-Anforderungen Ihrer Kunden im Businesskontext zu erfüllen.',\n });\n\n const getFirstLoadDataProtection = async () => {\n const result = await http.get(`gastro/${companyId}/metadata`);\n const _dataProtection = result?.data?.payload?.datenschutz;\n const _impressum = result?.data?.payload?.impressum;\n const _businessHours = result?.data?.payload?.business_hours;\n \n if (!_dataProtection && !_businessHours && !_impressum) {\n await http.post(`gastro/${companyId}/metadata`, {\n datenschutz: '',\n });\n }\n \n setDataprotection(_dataProtection);\n }\n\n \n useEffect(() => {\n getFirstLoadDataProtection();\n }, []);\n\n const saveDocument = async (html) => {\n return await http.put(`/gastro/${companyId}/metadata`, {\n datenschutz: html,\n });\n }\n\n return (\n \n
\n \n {workspaceTitle}\n \n {workspaceDescription}\n \n
\n\n \n\n \n \n {titleText} \n \n {bodyText}\n \n \n
\n \n 0 ? dataprotection : \"\"} saveDocument={saveDocument}/>\n }\n \n
\n \n
\n
\n );\n}\n\nexport default DataProtection;","export const LINK_TYPES = {\n INSTAGRAM: \"instagram\",\n TWITTER: \"twitter\",\n FACEBOOK: \"facebook\",\n WHATSAPP: \"whatsapp\",\n LINKEDIN: \"linkedin\",\n PHONE: \"phone\",\n EMAIL: \"email\",\n};\n\n/*\n * @TODO: We might want to chang that on the database level\n * as 'small' and 'text' do not necessary reflect\n * 'icon' and 'button' variations on the UI.\n */\nexport const LINK_VARIATIONS = {\n ICON: \"small\",\n BUTTON: \"text\",\n};\n","import React, { useEffect, useState } from \"react\";\nimport PreMenu, { generateLogo } from \"../../pages/Tablet/public/components/Restaurant/PreMenu\";\nimport { LINK_VARIATIONS } from \"../NewLink/linkMappings\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { Typography } from \"antd\";\nimport { getIntl } from \"../../utils/intl\";\nimport {\n setLivePreviewLinks,\n updateLivePreviewCompanySetup,\n} from \"../../redux/actions/livePreviewActions\";\nimport { linkIcons } from \"../../utils/LinkIcons\";\n\nconst LivePreview = () => {\n const { company_id, company_logo } = useSelector(\n (state) => state.companyConfig,\n );\n const intl = getIntl();\n const { Title, Paragraph } = Typography;\n const readMore = intl.formatMessage({\n id: \"WelcomyHubConfig.Phone.ReadMore\",\n defaultMessage: \"Weiter lesen\",\n });\n const previewLinkIcons = linkIcons;\n const dispatch = useDispatch();\n const links = useSelector((state) => state.companyConfig.links);\n const livePreviewLinks = useSelector((state) =>\n state.livePreview.links.filter((link) => link.variation === LINK_VARIATIONS.BUTTON),\n );\n const livePreviewIcons = useSelector((state) =>\n state.livePreview.links.filter((link) => link.variation === LINK_VARIATIONS.ICON),\n );\n const { hubName, logo, companyTitle, description } = useSelector(\n (state) => state.livePreview.companySetup,\n );\n \n const companyName = useSelector(state => state.companyConfig.name);\n const companyLogo = useSelector(state => state.companyConfig.company_logo);\n \n const _hubName = useSelector(state => state.hubConfig.name);\n const hubLogo = useSelector(state => state.hubConfig.hubLogo);\n const hubTitle = useSelector(state => state.hubConfig.title);\n const hubSubtitle = useSelector(state => state.hubConfig.subtitle);\n\n\n useEffect(() => {\n const name = _hubName || companyName;\n const logo = hubLogo || companyLogo;\n dispatch(updateLivePreviewCompanySetup({\n hubName: name,\n description: hubSubtitle,\n companyTitle: hubTitle,\n logo,\n }));\n }, [hubLogo]);\n\n useEffect(() => {\n const previewLinks = links?.filter((link) => link.visible === true);\n dispatch(setLivePreviewLinks(previewLinks));\n }, []);\n\n return (\n <>\n \n \n
\n \n );\n};\n\nexport default LivePreview;\n","import {\n CloudDownloadOutlined,\n FacebookOutlined,\n FormOutlined,\n InstagramOutlined, LaptopOutlined, LinkedinFilled,\n LinkOutlined,\n MailOutlined,\n PhoneOutlined, ProfileOutlined,\n SendOutlined, SolutionOutlined,\n TwitterOutlined, WhatsAppOutlined\n} from \"@ant-design/icons\";\nimport React from \"react\";\n\nexport const linkIcons = {\n 'link': \n
\n \n
\n \n
\n \n \n
\n
\n )\n}\n\nexport default WelcomyHubPreview;\n","import { defineMessages } from \"react-intl\";\n\nexport const messages = defineMessages({\n uploadText: {\n id: \"Upload\",\n defaultMessage: \"Datei hochladen\",\n },\n linkCall: {\n id: \"WelcomyHub.Link.Call\",\n defaultMessage: \"Telefonanruf\",\n },\n linkTypeText: {\n id: 'WelcomyHub.Link.Type',\n defaultMessage: 'Art des Links',\n },\n integrationDocsTitle: {\n id: 'WelcomyHub.Link.Title.Integration',\n defaultMessage: 'Integrationen & Dokumente',\n },\n contactSocialTitle: {\n id: 'WelcomyHub.Link.Title.Contact',\n defaultMessage: 'Kontaktinformationen & Social Links',\n },\n email: {\n id: \"Email\",\n defaultMessage: \"Email\",\n },\n newRibbon: {\n id: 'Ribbon.New',\n defaultMessage: \"Neu\",\n },\n AiSupportAssistant: {\n id: \"WelcomyHub.Link.AiPdf\",\n defaultMessage: \"Support KI\",\n },\n});\n","import { Badge, Divider, Radio, Space, Typography } from \"antd\";\nimport {\n CloudUploadOutlined,\n FacebookOutlined,\n FileOutlined,\n FormOutlined,\n InstagramOutlined,\n LaptopOutlined,\n LinkedinFilled,\n LinkOutlined,\n MailOutlined,\n PhoneOutlined,\n ProfileOutlined,\n RobotOutlined,\n SendOutlined,\n TwitterOutlined,\n WhatsAppOutlined,\n} from \"@ant-design/icons\";\nimport React, { useState } from \"react\";\nimport { messages } from \"./Translations\";\nimport \"./LinksVariations.scss\";\nimport { getIntl } from \"../../utils/intl\";\n\nconst { Title } = Typography;\n\nconst LinkVariations = ({ initialValue, onChange }) => {\n const [selectedValue, setSelectedValue] = useState(initialValue || \"link\");\n const translation = getIntl();\n\n useState(() => {\n onChange(selectedValue);\n }, [selectedValue, onChange]);\n\n const linkTypeChanges = (e) => {\n const linkType = e.target.value;\n setSelectedValue(linkType);\n onChange(linkType);\n };\n\n return (\n \n {translation.formatMessage(messages.linkTypeText)} \n
\n );\n};\nexport default LinkVariations;\n","\nimport { defineMessages } from 'react-intl';\n\nexport const messages = defineMessages({\n linkTypeText: {\n id: 'WelcomyHub.Link.Type',\n defaultMessage: 'Art des Links',\n },\n linkVariationText: {\n id: 'WelcomyHub.Link.Variation',\n defaultMessage: 'Variantion des Links',\n },\n withTextText: {\n id: 'WelcomyHub.Link.Variation.Text',\n defaultMessage: 'Als Button',\n },\n withoutTextText: {\n id: 'WelcomyHub.Link.Variation.Small',\n defaultMessage: 'Als Icon',\n },\n linkText: {\n id: 'WelcomyHub.Link.Text',\n defaultMessage: 'Linktext',\n },\n visibleText: {\n id: 'WelcomyHub.Visible.Text',\n defaultMessage: 'Sichtbar',\n },\n digitalCardText: {\n id: 'WelcomyHub.VirtualCard.Text',\n defaultMessage: 'Zur digitalen Visitenkarte hinzufügen',\n },\n clickPreventionText: {\n id: 'WelcomyHub.click.prevention',\n defaultMessage: 'Beenden Sie Ihre aktuelle Arbeit, bevor Sie fortfahren.',\n },\n uploadText: {\n id: 'Upload',\n defaultMessage: 'Datei hochladen',\n },\n phoneAddressText: {\n id: \"Phone\",\n defaultMessage: \"Telefon\",\n },\n whatsappAddressText: {\n id: 'whatsapp.text',\n defaultMessage: \"Telefonnummer(Beispiel: 49xxxxxxxxxxx)\",\n },\n fileText: {\n id: 'File.External',\n defaultMessage: 'Cloud-Link (z.B. Google Drive, iCloud, etc.)'\n },\n softwareText: {\n id: 'Link.Software',\n defaultMessage: 'Link zum Software-Widgets oder integrierte Webpage'\n },\n address: {\n id: \"Address\",\n defaultMessage: \"Adresse\",\n },\n deleteError: {\n id: \"WelcomyHub.Delete.Error\",\n defaultMessage: \"Der Link konnte nicht gelöscht werden\",\n },\n errorTitle: {\n id: \"Error\",\n defaultMessage: \"Etwas ist schief gelaufen!\",\n },\n saveError: {\n id: \"WelcomyHub.Save.Error\",\n defaultMessage: \"Der Link konnte nicht gespeichert werden\",\n },\n uploadError: {\n id: \"Upload.Error\",\n defaultMessage: \"Dateiupload fehlgeschlagen. Bitte versuchen Sie es erneut\"\n }\n ,\n addLink: {\n id: \"WelcomyHub.Link.Add\",\n defaultMessage: \"Link hinzufügen\"\n },\n cancel: {\n id: \"Cancel\",\n defaultMessage: \"Abbrechen\"\n },\n updateLink: {\n id: \"WelcomyHub.Link.Update\",\n defaultMessage: \"Link aktualisieren\"\n },\n goTo: {\n id: \"Welcomyhub.Link.Goto\",\n defaultMessage: \"Gehe zu\"\n },\n linkCreationSuccessTitle: {\n id: \"WelcomyHub.Save.Success.Title\",\n defaultMessage: \"Link wurde erstellt\"\n },\n linkCreationSuccessBody: {\n id: \"WelcomyHub.Save.Success.Body\",\n defaultMessage: \"Ihre Änderungen waren erfolgreich.\"\n },\n linkUpdateSuccessTitle: {\n id: \"WelcomyHub.Update.Success.Title\",\n defaultMessage: \"Link wurde aktualisiert\"\n },\n linkUpdateSuccessBody: {\n id: \"WelcomyHub.Update.Success.Body\",\n defaultMessage: \"Ihre Änderungen waren erfolgreich.\"\n },\n AiSupportAssistantDescription: {\n id: \"WelcomyHub.Link.AiPdf.Description\",\n defaultMessage: \"Laden Sie ein PDF-Dokument hoch, das alle relevanten Informationen zu Ihrem Produkt enthält. Welcomy wird die Arbeit automatisch für Sie erledigen.\"\n },\n UploadMissingErrorTitle: {\n id: \"WelcomyHub.Link.Upload.Missing.Error.Title\",\n defaultMessage: \"Dokument nicht hochgeladen.\",\n },\n UploadMissingErrorBody: {\n id: \"WelcomyHub.Link.Upload.Missing.Error.Body\",\n defaultMessage: \"Bitte laden Sie das Dokument hoch, bevor Sie den Link speichern.\",\n },\n NoLinkErrorTitle: {\n id: \"WelcomyHub.Link.Missing.Error.Title\",\n defaultMessage: \"Link-URL fehlt\",\n },\n NoLinkErrorBody: {\n id: \"WelcomyHub.Link.Missing.Error.Body\",\n defaultMessage: \"Bitte fügen Sie vor dem Speichern einen Link ein.\",\n },\n});\n","import {createLink, deleteLink} from \"./linkManagerApiService\";\n\nexport const createLinkManagement = (existingLinks, companyId, newLink) => {\n // here we delete id because BE expects links to be without ID\n // BE only cares about the order of the links\n const links = [newLink, ...existingLinks].map((link) => {\n delete link.id;\n if(link.type === \"email\"){\n // Delete subject as BE doesn't expect it. It is added for supporting\n // subjects in email type links.\n delete link.subject;\n }\n return link;\n })\n\n return createLink(companyId, links);\n}\n\nexport const deleteLinkManagement = (companyId, linkId) => {\n return deleteLink(companyId, linkId);\n}","import http from \"../utils/http\";\n\nexport const createLink = (companyId, links) => {\n return http.post(`/company/${companyId}/link`, { links })\n}\n\nexport const getLinks = (companyId) => {\n return http.get(`/company/${companyId}/link`);\n}\n\nexport const deleteLink = (companyId, linkId) => {\n return http.delete(`/company/${companyId}/link/${linkId}`);\n}\n\nexport const updateLinkApiService = (companyId, linkId, updatedLink) => {\n return http.put(`/company/${companyId}/link/${linkId}`, { ...updatedLink })\n}\n","import { Alert, Button, Card, Form, Input, Radio, Space, Switch, Upload } from \"antd\";\nimport { UploadOutlined } from \"@ant-design/icons\";\nimport React, { useEffect, useState } from \"react\";\nimport { useHistory } from \"react-router\";\nimport {\n deleteLivePreviewLink,\n updateLivePreviewLink,\n updateLivePreviewNewLink,\n} from \"../../redux/actions/livePreviewActions\";\nimport { useDispatch } from \"react-redux\";\nimport http from \"../../utils/http\";\nimport { displayNotification } from \"../Notification\";\nimport { getIntl } from \"../../utils/intl\";\nimport { getCookie } from \"../getCookie\";\nimport LinkVariations from \"../LinkVariations/LinkVariations\";\nimport { messages } from \"./Translations\";\nimport { createLinkManagement } from \"../../api/linkManagerManagementService\";\nimport {\n setCompanyLinks,\n updateCompanyLink,\n} from \"../../redux/actions/companyConfig\";\nimport { updateLinkApiService } from \"../../api/linkManagerApiService\";\nimport { linkCouldBeIcon } from './utils';\nimport { LINK_VARIATIONS } from \"./linkMappings\";\n\nconst VARIATION_DEFAULT_OPTION = LINK_VARIATIONS.BUTTON;\n\nconst NewLink = ({\n companyId,\n existingLinks,\n updateLinkId = null,\n onChange,\n}) => {\n const [form] = Form.useForm();\n const dispatch = useDispatch();\n const history = useHistory();\n const [linkType, setLinkType] = useState(null);\n const [isLinkSocialNetwork, setIsLinkSocialNetwork] = useState(false);\n const [linkVariation, setLinkVariation] = useState(VARIATION_DEFAULT_OPTION);\n const editIndex = existingLinks.findIndex((item) => item.id === updateLinkId);\n const updateLink = existingLinks[editIndex];\n const [loadingState, setLoadingState] = useState(false);\n\n useEffect(() => {\n if (updateLink) {\n setLinkType(updateLink.type);\n form.setFieldsValue(updateLink);\n linkTypeChange(updateLink.type)\n }\n }, []);\n\n const translation = getIntl();\n const uploadProps = {\n name: \"something\",\n multiple: false,\n showUploadList: false,\n headers: {\n Authorization: `Bearer ${getCookie(\"_a\")}`,\n },\n onChange: (info) => {\n const { status } = info.file;\n if (status === \"uploading\") {\n setLoadingState(true);\n }\n else if (status === \"done\"){\n setLoadingState(false);\n }\n else if (status === \"error\"){\n setLoadingState(false);\n displayNotification(\n \"error\",\n translation.formatMessage(messages.errorTitle),\n translation.formatMessage(messages.uploadError),\n );\n }\n },\n async customRequest(fileOpts) {\n const { onSuccess, onError } = fileOpts;\n let data = new FormData();\n data.append(\"file\", fileOpts.file);\n try {\n const res = await http.post(`/company/${companyId}/file`, data);\n form.setFieldsValue({ link: res.data.payload.url });\n onSuccess();\n } catch (error) {\n console.log(\"Error uploading file\", error);\n onError(error);\n }\n },\n };\n\n const handleFormValueChanges = (changes, allChanges) => {\n if (updateLink) {\n dispatch(\n updateLivePreviewLink({\n id: updateLink.id,\n updatedLink: {\n id: updateLink.id,\n ...form.getFieldsValue(),\n variation: isLinkSocialNetwork ? linkVariation : VARIATION_DEFAULT_OPTION,\n },\n }),\n );\n } else {\n dispatch(\n updateLivePreviewNewLink({\n id: \"TEMP_LINK\",\n content: {\n ...allChanges,\n variation: isLinkSocialNetwork ? allChanges.variation : VARIATION_DEFAULT_OPTION,\n },\n }),\n );\n }\n };\n\n const AddressText = () => {\n if (linkType === \"phone\") {\n return translation.formatMessage(messages.phoneAddressText);\n }\n\n if (linkType === \"file\") {\n return translation.formatMessage(messages.fileText);\n }\n\n if (linkType === \"software\") {\n return translation.formatMessage(messages.softwareText);\n }\n\n if (linkType === \"whatsapp\") {\n return translation.formatMessage(messages.whatsappAddressText);\n }\n\n return translation.formatMessage(messages.address);\n };\n\n const cancelEdit = () => {\n if (!updateLink) {\n dispatch(deleteLivePreviewLink({ id: \"TEMP_LINK\" }));\n form.resetFields();\n }\n onChange();\n };\n\n const goTo = () => {\n if(linkType === 'newsletter'){\n history.push(\"/dashboard/subscriptions\");\n }\n else if(linkType === 'product_and_services'){\n history.push(\"/dashboard/digital-menu\");\n }\n else if(linkType === 'impressum'){\n history.push(\"/dashboard/impressum\");\n }\n }\n\n const updateLinkCard = () => {\n let updatedLink = {\n ...updateLink,\n ...form.getFieldsValue(),\n type: linkType,\n };\n updatedLink = constructLinks(linkType, updatedLink);\n\n delete updatedLink.id;\n\n if (!validateForm(linkType, updatedLink)){\n return;\n }\n updateLinkApiService(companyId, updateLink?.id, updatedLink)\n .then((res) => {\n const linkUpdate = { id: updateLink.id, ...updatedLink };\n\n dispatch(\n updateCompanyLink({ id: updateLink.id, updatedLink: linkUpdate }),\n );\n displayNotification(\n \"success\",\n translation.formatMessage(messages.linkUpdateSuccessTitle),\n translation.formatMessage(messages.linkUpdateSuccessBody),\n );\n onChange();\n })\n .catch((err) => {\n console.error(err);\n displayNotification(\n \"error\",\n translation.formatMessage(messages.errorTitle),\n translation.formatMessage(messages.saveError),\n );\n });\n };\n const constructLinks = (linkType, link) => {\n if (linkType === \"email\") {\n const subject = link[\"subject\"] || \"\";\n const emailLinkWithSubject = `${link[\"link\"]}?subject=${subject}`;\n delete link[\"subject\"];\n return {\n ...link,\n link: emailLinkWithSubject,\n };\n } else if (linkType === \"newsletter\") {\n return {\n ...link,\n link: `${window.location.protocol}//${window.location.host}/public/welcome/form/newsletter-form`,\n };\n } else if (linkType === \"product_and_services\") {\n return {\n ...link,\n link: `${window.location.protocol}//${window.location.host}/public/welcome/form/menu`,\n };\n } else if (linkType === \"pdf-ai\") {\n return {\n ...link,\n chat_with_pdf: true\n }\n } else if(linkType === \"whatsapp\"){\n if (!link[\"link\"]) return link;\n const whatsappURL = \"https://wa.me/\";\n const urlIndex = link[\"link\"].indexOf(whatsappURL);\n let phoneNumber = link[\"link\"];\n if (urlIndex !== -1){\n phoneNumber = link[\"link\"].substring(urlIndex + whatsappURL.length);\n }\n return {\n ...link,\n link: `https://wa.me/${phoneNumber}`,\n }\n } else {\n return link;\n }\n };\n\n const validateForm = (linkType, link) => {\n if(!link[\"link\"]){\n if (linkType === \"upload\"){\n displayNotification(\n \"error\",\n translation.formatMessage(messages.UploadMissingErrorTitle),\n translation.formatMessage(messages.UploadMissingErrorBody),\n );\n }\n else {\n displayNotification(\n \"error\",\n translation.formatMessage(messages.NoLinkErrorTitle),\n translation.formatMessage(messages.NoLinkErrorBody),\n );\n }\n return false;\n }\n return true;\n }\n\n const saveCard = () => {\n let newLink = {\n ...form.getFieldsValue(),\n name:\n form.getFieldValue(\"variation\") === LINK_VARIATIONS.ICON\n ? form.getFieldValue(\"link\")\n : form.getFieldValue(\"name\") || form.getFieldValue(\"name\"),\n type: linkType,\n };\n newLink = constructLinks(linkType, newLink);\n\n if (!validateForm(linkType, newLink)){\n return;\n }\n createLinkManagement(existingLinks, companyId, newLink)\n .then((res) => {\n /* here I remove the link from the preview when the link is created successfully because\n the endpoint is already sending back the full updated links to avoid LINK duplication\n in the live preview */\n dispatch(deleteLivePreviewLink({ id: \"TEMP_LINK\" }));\n dispatch(setCompanyLinks(res.data.payload));\n displayNotification(\n \"success\",\n translation.formatMessage(messages.linkCreationSuccessTitle),\n translation.formatMessage(messages.linkCreationSuccessBody),\n );\n\n // this on Change to close the Add link section\n onChange();\n })\n .catch((err) => {\n dispatch(deleteLivePreviewLink({ id: \"TEMP_LINK\" }));\n displayNotification(\n \"error\",\n translation.formatMessage(messages.errorTitle),\n translation.formatMessage(messages.saveError),\n );\n });\n };\n\n\n const linkTypeChange = (linkType) => {\n const fieldsValue = form.getFieldsValue();\n\n if (linkCouldBeIcon(linkType)) {\n setIsLinkSocialNetwork(true);\n } else {\n setIsLinkSocialNetwork(false);\n fieldsValue.variation = VARIATION_DEFAULT_OPTION;\n }\n\n setLinkType(linkType);\n\n if (updateLink) {\n dispatch(\n updateLivePreviewLink({\n id: updateLink?.id,\n updatedLink: {\n ...fieldsValue,\n type: linkType,\n variation: fieldsValue.variation,\n },\n }),\n );\n } else {\n dispatch(\n updateLivePreviewNewLink({\n id: \"TEMP_LINK\",\n content: {\n ...fieldsValue,\n type: linkType,\n variation: fieldsValue.variation,\n },\n }),\n );\n }\n };\n\n return (\n <>\n \n {translation.formatMessage(messages.integrationDocsTitle)} \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n \n {translation.formatMessage(messages.contactSocialTitle)} \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n \n Welcomy Tools \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n \n \n \n
\n \n \n {\n linkTypeChange(e);\n }}\n />\n \n {\n await setLinkVariation(() => {\n return e.target.value;\n });\n linkTypeChange(linkType);\n }}\n >\n \n \n {translation.formatMessage(messages.withoutTextText)}\n \n \n\n \n \n {translation.formatMessage(messages.withTextText)}\n \n \n \n \n \n \n \n \n \n )}\n {linkType !== \"newsletter\" &&\n linkType !== \"upload\" &&\n linkType !== \"pdf-ai\" &&\n linkType !== \"product_and_services\" && (\n \n \n \n )}\n \n
\n \n \n \n \n {linkType === \"pdf-ai\" && (\n \n }>\n {translation.formatMessage(messages.uploadText)}\n \n \n
\n )}\n {linkType == \"email\" && (\n \n \n {[\"newsletter\", \"impressum\",\n \"product_and_services\"].includes(linkType) && (\n \n )}\n {!updateLink && (\n \n )}\n {updateLink && (\n \n )}\n
\n \n
\n )\n\n return (\n \n {hubLink.link}
\n
\n \n
\n
\n \n
\n \n
\n \n
\n\n \n \n
\n \n \n
\n \n {children}\n
\n );\n };\n\n const saveLinks = async (_links = links) => {\n try {\n return await http.post(`/company/${companyId}/link`, {\n links: _links.map((link) => {\n delete link.id;\n return link;\n }),\n });\n } catch (error) {\n console.log(\"Unable to save links\", error);\n }\n };\n\n const moveCard = useCallback(\n async (dragIndex, hoverIndex) => {\n const dragRow = links[dragIndex];\n\n const result = update(links, {\n $splice: [\n [dragIndex, 1],\n [hoverIndex, 0, dragRow],\n ],\n });\n await setLinks(result);\n result.map((link) => {\n if (link[\"type\"] == \"email\"){\n const subject = link[\"subject\"] || \"\";\n link[\"link\"] = `${link[\"link\"]}?subject=${subject}`;\n delete link[\"subject\"]; \n }\n });\n await saveLinks(result)\n .then((response) => {\n /**\n * @TODO: Debounce requests\n *\n * The sucess feedback for the reordering operation should be the\n * the new position of the element in the UI with no errors.\n *\n * If we really want a feedback operation, e.g. notification, we will\n * require to debouce this operation in order not to spam the user\n * (as we hit the API after every change).\n *\n */\n const previewLinks = response.data.payload.filter((link) => link.visible === true);\n dispatch(setLivePreviewLinks(previewLinks));\n setLinks([...response.data.payload]);\n })\n .catch((error) => {\n const errorTitle = intl.formatMessage({\n id: \"Error\",\n defaultMessage: \"Etwas ist schief gelaufen!\",\n });\n const reorderError = intl.formatMessage({\n id: \"WelcomyHub.Save.Order.Error\",\n defaultMessage: \"Die Änderung ist fehlgeschlagen\",\n });\n displayNotification(\"error\", errorTitle, reorderError);\n console.log(error);\n });\n /**\n * UPDATE BACKEND WITH NEW ORDER\n */\n },\n [observer],\n );\n\n const newLinkChange = () => {\n setShowAddNewLink(false);\n setshowEmptyPlaceholder(true);\n setEditCard(null);\n };\n\n const linkCardChange = (linkId) => {\n setEditCard(linkId);\n };\n\n const Cards = () => {\n // Add a link type here to avoid rendering it.\n const EXCLUSION_LINKS = ['registration'];\n return (\n <>\n {!!links.length &&\n links.filter(aLink => EXCLUSION_LINKS.indexOf(aLink.type) === -1).map((aLink, index) => {\n return (\n \n \n \n {title}\n \n triggerNode.parentNode}\n visible={popoverIndex === -1}\n >\n }\n >\n {addButton}\n \n {showAddNewLink && (\n \n \n )}\n \n
\n
\n );\n};\n\nexport default React.memo(WelcomyHub);\n","import React from 'react';\nimport WelcomyHubPreview from '../WelcomyHubPreview/WelcomyHubPreview';\nimport WelcomyHub from '.';\n\nconst PreviewWrapperHub = (props) => {\n return (\n \n \n {noLinksText}\n \n }\n />
\n )}\n {!!links.length && (\n \n {hub_logo ? (\n 
\n ) : (\n
\n );\n\n return (\n \n
\n )}\n Upload Logo
\n \n 
\n
\n ) : (\n {uploadReadylabel}
\n \n \n \n
\n );\n};\n\nexport default WelcomyHubConfig;\n","import React from 'react';\nimport WelcomyHubPreview from '../WelcomyHubPreview/WelcomyHubPreview';\nimport WelcomyHubConfig from './WelcomyHubConfig';\n\nconst PreviewWrapperConfigHub = (props) => {\n return (\n \n \n \n \n changeTitle(e)}\n maxLength={maxCharsTitle}\n placeholder={titlePlaceholder}\n disabled={isLoading}\n />\n \n \n {title.length}/{maxCharsTitle}\n \n \n changeHubName(e)}\n placeholder={namePlaceholder}\n disabled={isLoading}\n />\n \n \n changeSubtitle(e)}\n maxLength={maxCharsSubtitle}\n className=\"layout-form__textarea\"\n placeholder={subtitlePlaceholder}\n disabled={isLoading}\n />\n \n \n {subtitle.length}/{maxCharsSubtitle}\n \n \n \n \n \n
\n \n \n
\n \n );\n};\nexport default UserManagementTable;\n","import React, { useEffect, useState } from \"react\";\nimport { Button } from \"antd\";\nimport { getIntl } from \"../../utils/intl\";\nimport InviteUserModal from \"../../components/InviteUserModal\";\nimport UserManagementTable from \"./Table\";\nimport { getUsersApi } from \"../../api/userManagementApiService\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { setUsers } from \"../../redux/actions/usersActions\";\nimport { getCookie } from \"../../components/getCookie\";\n\nconst UserManagement = () => {\n const intl = getIntl();\n const dispatch = useDispatch();\n const [inviteUserModal, setInviteUserModal] = useState(false);\n const handleOnCancelInviteUser = () => {\n setInviteUserModal(false);\n };\n const companyId = useSelector((state) => state.companyConfig.company_id);\n const users = useSelector((state) => state.usersManagement.users);\n\n const userRole = getCookie(\"_ur\");\n const isAdmin = userRole === 'admin';\n\n const userManagementTitle = intl.formatMessage({\n id: \"UserManagement.Title\",\n defaultMessage: \"Nutzerverwaltung\"\n });\n const userManagementDescription = intl.formatMessage({\n id: \"UserManagement.Description\",\n defaultMessage: \"Verwalten Sie hier Ihre Benutzer\"\n });\n const inviteUserButtonText = intl.formatMessage({\n id: \"UserManagement.InviteUser.Button.Text\",\n defaultMessage: \"Benutzer einladen\"\n });\n\n\n useEffect(() => {\n getUsersApi(companyId).then((users) => {\n dispatch(setUsers(users?.data.payload));\n });\n }, []);\n\n return (\n <>\n \n setSearchText(e.target.value)}\n />\n
\n handleUpdateModalConfirm(e)}\n onCancel={() => setUpdateUser(null)}\n />\n
\n \n \n \n
\n \n );\n};\n\nexport default UserManagement;\n","import React, { useEffect, useRef } from \"react\";\nimport { Chart } from \"chart.js\";\nimport { Spin } from \"antd\";\n\nfunction BarChart({ data, title, limit }) {\n const ref = useRef(null);\n\n let labels = [];\n let values = [];\n if (data) {\n labels = Object.keys(data);\n values = Object.values(data);\n\n if (limit) {\n labels = labels.splice(labels.length - limit);\n values = values.splice(values.length - limit);\n }\n }\n\n useEffect(() => {\n if (data) {\n new Chart(ref.current, {\n type: \"bar\",\n data: {\n labels: labels,\n datasets: [\n {\n label: title,\n data: values,\n backgroundColor: \"rgba(54, 162, 235, 1)\",\n borderColor: \"rgba(54, 162, 235, 1)\",\n borderWidth: 1,\n },\n ],\n },\n options: {\n responsive: true,\n scales: {\n y: {\n suggestedMin: 0,\n suggestedMax: 50,\n },\n },\n },\n });\n }\n }, [data]);\n\n if (!data)\n return (\n \n
\n \n {userManagementTitle}\n {userManagementDescription}\n
\n\n \n\n
\n );\n\n return (\n \n
\n \n \n
\n );\n}\n\nexport default BarChart;\n","import React, { useEffect, useRef } from \"react\";\nimport { Chart } from \"chart.js\";\nimport { Spin } from \"antd\";\n\nfunction LineChart({ data, title, limit }) {\n const ref = useRef(null);\n\n let labels = [];\n let values = [];\n if (data) {\n labels = Object.keys(data);\n values = Object.values(data);\n\n if (limit) {\n labels = labels.splice(labels.length - limit);\n values = values.splice(values.length - limit);\n }\n }\n\n useEffect(() => {\n if (data) {\n new Chart(ref.current, {\n type: \"line\",\n data: {\n labels: labels,\n labels: labels,\n datasets: [\n {\n label: title,\n data: values,\n borderColor: \"rgba(54, 162, 235, 1)\",\n backgroundColor: \"rgba(54, 162, 235, 1)\",\n fill: false,\n tension: 0.4,\n },\n ],\n },\n options: {\n responsive: true,\n scales: {\n y: {\n suggestedMin: 0,\n suggestedMax: 50,\n },\n },\n },\n });\n }\n }, [data]);\n\n if (!data)\n return (\n \n
\n );\n\n return (\n \n
\n \n \n
\n );\n}\n\nexport default LineChart;\n","import { defineMessages } from \"react-intl\";\n\nexport const messages = defineMessages({\n pageTitle: {\n id: \"Analytics.Page.Title\",\n defaultMessage: \"Welcomy Hub Analytics\",\n },\n counterTotalTitle: {\n id: \"Analytics.Counters.Total.Title\",\n defaultMessage: \"Gesamtnutzungsrate der Hub\",\n },\n counterTotalSeven: {\n id: \"Analytics.Counters.Total.Seven\",\n defaultMessage: \"Letzten 7 Tage\",\n },\n counterTotalThirtyOne: {\n id: \"Analytics.Counters.Total.ThirtyOne\",\n defaultMessage: \"Letzten 31 Tage\",\n },\n lineChartSevenTitle: {\n id: \"Analytics.Line.Seven.Title\",\n defaultMessage: \"Nutzungsrate der Hub in den letzten 7 Tagen\",\n },\n lineChartSevenLegend: {\n id: \"Analytics.Line.Seven.Legend\",\n defaultMessage: \"Anzahl der Aufrufe\",\n },\n barCharttThirtyOneTitle: {\n id: \"Analytics.Bar.ThirtyOne.Title\",\n defaultMessage: \"Nutzungsrate der Hub in den letzten 31 Tagen\",\n },\n barCharttThirtyOneLegend: {\n id: \"Analytics.Bar.ThirtyOne.Legend\",\n defaultMessage: \"Anzahl der Aufrufe\",\n },\n tableCountriesTitle: {\n id: \"Analytics.Countries.Title\",\n defaultMessage: \"Nutzungsrate der Hub pro Land in den letzten 31 Tagen\",\n },\n tableCountriesColumnCountry: {\n id: \"Analytics.Countries.Column.Country\",\n defaultMessage: \"Land\",\n },\n tableCountriesColumnUsage: {\n id: \"Analytics.Countries.Column.Usage\",\n defaultMessage: \"Nutzungsrate der Hub\",\n },\n});\n","import React from \"react\";\nimport \"flag-icons/css/flag-icons.min.css\";\nimport { Spin, Table } from \"antd\";\nimport { messages } from \"../translations\";\nimport { getIntl } from \"../../../utils/intl\";\n\n\nfunction TopCountries({ data }) {\n const intl = getIntl();\n\n const columns = [\n {\n title: intl.formatMessage(messages.tableCountriesColumnCountry),\n key: \"country\",\n dataIndex: \"country\",\n sorter: (a, b) => {\n if (a.country > b.country) return 1;\n if (a.country < b.country) return -1;\n return 0;\n },\n sortDirections: [\"descend\", \"ascend\"],\n showSorterTooltip: false,\n },\n {\n title: intl.formatMessage(messages.tableCountriesColumnUsage),\n dataIndex: \"loads\",\n key: \"loads\",\n sorter: (a, b) => a.loads - b.loads,\n defaultSortOrder: \"descend\",\n sortDirections: [\"descend\", \"ascend\"],\n showSorterTooltip: false,\n },\n ];\n\n let _data = [];\n if (data) {\n _data = Object.keys(data).map((country) => ({\n country,\n loads: data[country],\n }));\n }\n\n if (!data)\n return (\n \n
\n );\n\n return (\n \n
\n \n
\n
\n );\n}\n\nexport default TopCountries;\n","import React, { memo, useEffect, useState } from \"react\";\nimport { Card, Col, Row, Statistic, Typography } from \"antd\";\nimport { useSelector } from \"react-redux\";\nimport http from \"../../utils/http\";\nimport { getIntl } from \"../../utils/intl\";\nimport BarChart from \"./charts/BarChart\";\nimport LineChart from \"./charts/LineChart\";\nimport TopCountries from \"./tables/TopCountries\";\nimport { messages } from \"./translations\";\n\nconst { Title } = Typography;\n\nconst HubAnalytics = () => {\n const companyId = useSelector((state) => state.companyConfig.company_id);\n const [hubAnalytics, setHubAnalytics] = useState(null);\n\n const intl = getIntl();\n\n const fetchHubAccess = async () => {\n let response = {};\n if (!hubAnalytics?.hubAccessDates) {\n let responseByDate = await http.get(\n `/company/${companyId}/analytics?type=wh_open_rate`\n );\n response = {\n ...response,\n hubAccessDates: responseByDate.data.payload,\n };\n }\n if (!hubAnalytics?.hubAccessCountries) {\n let responseByCountry = await http.get(\n `/company/${companyId}/analytics?type=wh_open_rate_country`\n );\n response = {\n ...response,\n hubAccessCountries: responseByCountry.data.payload,\n };\n }\n setHubAnalytics(response);\n };\n\n useEffect(() => {\n fetchHubAccess();\n }, []);\n\n return (\n \n \n {intl.formatMessage(messages.pageTitle)} \n \n
\n \n \n \n acc + val, 0)\n : 0\n }\n />\n \n acc + val,\n 0\n )\n : 0\n }\n />\n \n
\n \n \n
\n \n \n \n \n \n \n \n
\n \n \n \n
\n
\n );\n};\n\nexport default memo(HubAnalytics);\n","import { Typography } from \"antd\";\nimport React from \"react\";\n\nconst { Paragraph } = Typography;\n\nfunction PageHeader({ title, subtitle, level, ...props }) {\n return (\n \n
\n );\n}\n\nexport default PageHeader;\n","import { Button, Col, Form, Input, Row, Typography } from \"antd\";\nimport { useForm } from \"antd/lib/form/Form\";\nimport React, { useCallback, useState } from \"react\";\nimport PageHeader from \"../components/PageHeader\";\nimport { InfoCircleOutlined } from \"@ant-design/icons\";\nimport { getIntl } from \"../utils/intl\";\nimport { LogoUpload } from \"./LogoUpload\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport http from \"../utils/http\";\nimport { displayNotification } from \"../components/Notification\";\nimport { configSetter } from \"../redux/actions\";\n\nconst { Title, Paragraph } = Typography;\n\nfunction CompanySetup(props) {\n const intl = getIntl();\n const [form] = useForm();\n const dispatch = useDispatch();\n const [isLoading, setIsLoading] = useState(null);\n\n const companyLogo = useSelector((state) => state.companyConfig.company_logo);\n const name = useSelector((state) => state.companyConfig.name);\n const legalEntity = useSelector((state) => state.companyConfig.legalEntity);\n const companyId = useSelector((state) => state.companyConfig.company_id);\n const superAccount = useSelector(\n (state) => state.companyConfig.super_account,\n );\n\n const [logo, setLogo] = useState(companyLogo);\n\n const logoLabel = intl.formatMessage({\n id: \"WelcomyHubConfig.Label.Logo\",\n defaultMessage: \"Logo hochladen\",\n });\n\n const saveButton = intl.formatMessage({\n id: \"Save\",\n defaultMessage: \"Speichern\",\n });\n\n const title = intl.formatMessage({\n id: \"MyCompany.Configuration.Title\",\n defaultMessage: \"Unternehmensprofil anpassen\",\n });\n\n const formTitle = intl.formatMessage({\n id: \"MyCompany.Configuration.Form.Title\",\n defaultMessage: \"Grundlegende Informationen Ihres Unternehmens\",\n });\n\n const legalNameInput = intl.formatMessage({\n id: \"MyCompany.Configuration.LegalName\",\n defaultMessage: \"Name der juristischen Person\",\n });\n\n const commercialNameInput = intl.formatMessage({\n id: \"MyCompany.Configuration.CommercialName\",\n defaultMessage: \"Handelsüblicher Name\",\n });\n\n const successNotificationTitle = intl.formatMessage({\n id: \"MyCompany.Configuration.Success.Title\",\n defaultMessage: \"Erfolg!\",\n });\n\n const successNotificationBody = intl.formatMessage({\n id: \"MyCompany.Configuration.Success.Body\",\n defaultMessage: \"Unternehmensprofil wurde erfolgreich gespeichert\",\n });\n\n const errorNotificationTitle = intl.formatMessage({\n id: \"MyCompany.Configuration.Error.Title\",\n defaultMessage: \"Unable to save company profile\",\n });\n\n const errorNotificationBody = intl.formatMessage({\n id: \"General.ErrorNotification.Body\",\n });\n\n const handleLogoChange = useCallback((payload) => {\n const { companyLogo } = payload;\n if (companyLogo && companyLogo[0] && companyLogo[0].originFileObj) {\n const logoFile = companyLogo[0].originFileObj;\n setLogo(logoFile);\n }\n }, []);\n\n const saveCompanyConfig = async (name, legalEntity, logo) => {\n let data = new FormData();\n\n data.append(\"name\", name);\n if (legalEntity){\n data.append(\"legal_entity\", legalEntity);\n }\n if (logo) {\n data.append(\"logo\", logo);\n }\n\n try {\n const response = await http.post(`/company/${companyId}`, data);\n return response;\n } catch(error) {\n console.log(error);\n displayNotification(\n \"error\",\n errorNotificationTitle,\n errorNotificationBody\n );\n }\n };\n\n const submit = async ({ companyLogo, legalEntity, commercialName }) => {\n setIsLoading(true);\n if (companyLogo) {\n try {\n const response = await saveCompanyConfig(commercialName, legalEntity, companyLogo[0].originFileObj);\n if (!response){\n setIsLoading(false);\n return;\n }\n if (response.length === 0) throw new Error();\n if (response.status === 200) {\n dispatch(\n configSetter({\n name: commercialName,\n legalEntity,\n company_logo: response.data.payload.logo_url\n })\n );\n displayNotification(\n \"success\",\n successNotificationTitle,\n successNotificationBody\n );\n }\n } catch (error) {\n console.error(\"Error while uploading hub image\", Object.keys(error));\n displayNotification(\n \"error\",\n errorNotificationTitle,\n errorNotificationBody\n );\n }\n } else {\n try {\n const response = await saveCompanyConfig(commercialName, legalEntity);\n if(!response) throw new Error(\"Unable to save company config\");\n if (response.status === 200) {\n dispatch(\n configSetter({\n name: commercialName,\n legalEntity,\n })\n );\n displayNotification(\n \"success\",\n successNotificationTitle,\n successNotificationBody\n );\n }\n else {\n displayNotification(\n \"error\",\n errorNotificationTitle,\n errorNotificationBody\n );\n }\n } catch(error){\n console.log(error);\n }\n }\n setIsLoading(false);\n };\n\n return (\n \n {title}\n {subtitle && {subtitle}}\n
\n\n \n \n \n \n )}\n \n )}\n \n
\n );\n } else return null;\n};\n\nexport default React.memo(MainContent);\n","import React, { memo, useState } from 'react';\nimport Navbar from './Navbar/Navbar';\nimport MainContent from './MainContent';\nimport { Layout } from 'antd';\n\nconst { Header, Content } = Layout;\nconst HEADER_TOP_DISTANCE = 60;\nconst SCROLL_WRAPPER_ID = \"content-scroll-wrapper\";\n\nconst ScrollListener = (props) => {\n const [isScrollTop, setIsScrollTop] = useState(false);\n\n const handleScroll = (e) => {\n if (e.target.id === SCROLL_WRAPPER_ID) {\n const distanceToTop = e.target.scrollTop;\n const scrolled = distanceToTop > HEADER_TOP_DISTANCE;\n setIsScrollTop(scrolled);\n }\n }\n\n return (\n \n \n \n Welcomy \n \n \n\n \n \n \n \n \n \n \n \n {/* \n Wrapper for main content.\n This is needed to change the navbar color\n on scroll.\n */}\n \n \n \n \n \n \n
\n );\n}\n\nexport default App;\n","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.0/8 are considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit https://bit.ly/CRA-PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then(registration => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See https://bit.ly/CRA-PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl, {\n headers: { 'Service-Worker': 'script' }\n })\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister();\n });\n }\n}\n","// import './wdyr';\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.scss';\nimport 'antd-mobile/dist/antd-mobile.css';\nimport App from './App';\nimport * as serviceWorker from './serviceWorker';\n\nReactDOM.render(\n