\r\n {Object.keys(LanguageJson).map((Language) => (\r\n setLanguage(Language)}\r\n className={cssStyle.languageName}\r\n >\r\n \r\n \r\n ))}\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default LanguageDropdown;\r\n","import { FunctionComponent } from \"react\";\r\nimport React from \"react\";\r\nimport cssStyles from \"./Artwork.module.scss\";\r\n\r\ninterface ArtworkProps {\r\n \r\n}\r\n \r\nconst Artwork: FunctionComponent\r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n}\r\n \r\nexport default Artwork;","import React from \"react\";\r\nimport { FunctionComponent } from \"react\";\r\nimport { FormattedMessage } from \"react-intl\";\r\nimport cssStyles from \"../../OverviewPageContent.module.scss\";\r\nimport Artwork from \"../Artwork/Artwork\";\r\n\r\nconst OverviewHeader: FunctionComponent = () => {\r\n return (\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default OverviewHeader;","import React, { FunctionComponent } from \"react\";\r\nimport cssStyles from \"./OverviewCard.module.scss\";\r\nimport { Text } from \"@fluentui/react-northstar\"\r\nimport { Link } from \"react-router-dom\";\r\nimport { FormattedMessage } from \"react-intl\";\r\ninterface OverviewCardProps {\r\n TitleTranslationId: string,\r\n DescriptionTranslationId: string,\r\n Company: string,\r\n Image: string,\r\n CategoryTranslationId: string,\r\n TargetUrl?: string,\r\n LinkParams?: string\r\n}\r\n\r\n\r\n\r\nconst OverviewCard: FunctionComponent\r\n \r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n );\r\n}\r\n\r\nexport default OverviewCard;","import * as React from 'react';\r\nimport { FormattedMessage } from 'react-intl';\r\n\r\ninterface FooterItemProps {\r\n defaultText?:string;\r\n multilingualTextId:string;\r\n webUrl:string;\r\n className:string;\r\n}\r\n \r\nconst FooterItem: React.FunctionComponent\r\n
\r\n \r\n 
\r\n
\r\n \r\n {props.Company} \r\n
\r\n \r\n
\r\n )}\r\n \r\n );\r\n }\r\n}\r\n\r\nexport default Footer;\r\n","import React from \"react\";\r\nimport \"./UsefulLinksModule.scss\";\r\nimport { FormattedMessage } from \"react-intl\";\r\nimport Cards from \"../../data/Cards.json\";\r\nfunction UsefulLinks() {\r\n return (\r\n \r\n Copyright {new Date().getFullYear()} © Solutions2Share GmbH\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n {Cards.UsefulLinks.map((card) => (\r\n
\r\n );\r\n}\r\n\r\nexport default UsefulLinks;\r\n","let teamsContext = null;\r\nlet isInitialized = false;\r\n\r\nexport const GetContext = (contextCallback: (context: microsoftTeams.Context) => void) => {\r\n if (!teamsContext && !isInitialized) {\r\n microsoftTeams.initialize(() => {\r\n microsoftTeams.getContext((context) => {\r\n teamsContext = context;\r\n contextCallback(teamsContext);\r\n });\r\n });\r\n }\r\n else if (teamsContext) {\r\n contextCallback(teamsContext);\r\n }\r\n isInitialized = true;\r\n};\r\n\r\nexport const isInTeams = ()=> {\r\n if (!isInitialized) {\r\n console.error(\"TeamsContextHandler is not initialized\");\r\n return false;\r\n }\r\n if (!teamsContext) {\r\n return false;\r\n }\r\n return true;\r\n}","\r\nimport React from \"react\";\r\nimport {\r\n FormattedMessage,\r\n injectIntl,\r\n WrappedComponentProps,\r\n} from \"react-intl\";\r\nimport cssStyles from \"./OverviewPageContent.module.scss\";\r\nimport Cards from \"./data/Cards.json\";\r\nimport NavCategories from \"./data/NavCategories.json\";\r\nimport LanguageDropdown from \"../../GlobalComponents/LanguageDropdown/LanguageDropdown\";\r\nimport OverviewHeader from \"./components/Header/OverviewHeader\";\r\nimport OverviewCard from \"./components/OverviewCard/OverviewCard\";\r\nimport { getAllQueryParameters } from \"../../Utilities/Url\";\r\nimport Footer from \"../../GlobalComponents/Footer/Footer\";\r\nimport UsefulLinks from \"./components/UsefulLinks/UsefulLinks\";\r\nimport { isInTeams } from \"../../Utilities/TeamsContextHandler\";\r\n\r\ninterface OverviewpageContentProps {\r\n}\r\n\r\ninterface OverviewpageContentState {\r\n filteredCards: any[];\r\n selectedNavCategory: number;\r\n headerButtonToggle: string;\r\n}\r\n\r\nclass OverviewpageContent extends React.Component<\r\n OverviewpageContentProps & WrappedComponentProps,\r\n OverviewpageContentState\r\n> {\r\n constructor(props: OverviewpageContentProps & WrappedComponentProps) {\r\n super(props);\r\n this.state = {\r\n filteredCards: [],\r\n selectedNavCategory: 0,\r\n headerButtonToggle: \"overview\",\r\n };\r\n }\r\n\r\n filterCards(filterFor: string) {\r\n var cards = [];\r\n if (filterFor === \"all\") {\r\n cards = Cards.Overview;\r\n } else {\r\n cards = Cards.Overview.filter((card) => card.categoryId === filterFor);\r\n }\r\n this.setState({ filteredCards: cards });\r\n }\r\n\r\n componentDidMount() {\r\n this.filterCards(\"all\");\r\n }\r\n\r\n setHeaderButtonToggle(toggle: string) {\r\n this.setState({ headerButtonToggle: toggle });\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n ))}\r\n \r\n
\r\n \r\n ![\"\"]({\"/img/OverviewPage/\")
\r\n \r\n {\" \"}\r\n
\r\n \r\n \r\n {\" \"}\r\n \r\n
\r\n {/*
\r\n )}\r\n\r\n {this.state.headerButtonToggle === \"overview\" ? (\r\n \r\n {!isInTeams() && (\r\n
\r\n )}\r\n \r\n
\r\n \r\n \r\n {/* this.setHeaderButtonToggle(\"overview\")}\r\n >\r\n Overview\r\n \r\n this.setHeaderButtonToggle(\"usefulLinks\")}\r\n >\r\n Useful links\r\n \r\n
\r\n Solutions2Share
\r\n\r\n {NavCategories.map((navCategory, index) => (\r\n {\r\n this.setState({ selectedNavCategory: index });\r\n this.filterCards(\r\n navCategory.id.substring(\r\n navCategory.id.indexOf(\".\") + 1\r\n )\r\n );\r\n }\r\n : null\r\n }\r\n className={cssStyles.navBarCategoryItem}\r\n id={\r\n index === this.state.selectedNavCategory\r\n ? cssStyles.selectedNavCategory\r\n : null\r\n }\r\n >\r\n
\r\n ))}\r\n \r\n {this.state.filteredCards.map((card) => (\r\n
\r\n ) : (\r\n \r\n
\r\n )}\r\n \r\n \r\n \r\n );\r\n }\r\n}\r\n\r\nexport default injectIntl(OverviewpageContent);\r\n","import React from \"react\";\r\nimport OverviewPageContent from \"./OverviewPageContent\"\r\n\r\ninterface OverviewPageState {\r\n teamsContext: microsoftTeams.Context;\r\n isTeamsContext: boolean;\r\n}\r\n\r\nclass OverviewPage extends React.Component- \r\n {sections.checkmarks?.map((value, index) => (\r\n
- \r\n
\r\n \r\n\r\n \r\n ))}\r\n
\r\n
\r\n );\r\n};\r\n\r\nexport default Sections;\r\n","import React, { FunctionComponent, ReactElement } from \"react\";\r\nimport style from \"./CardItem.module.scss\";\r\nimport { FormattedMessage } from \"react-intl\";\r\n//Card Properties\r\ntype CardProps = {\r\n title: string;\r\n text: string;\r\n icon: ReactElement;\r\n translationHeaderID: string;\r\n translationTextID: string;\r\n};\r\n\r\n//Main\r\nexport const Card: FunctionComponent\r\n {getSelectedProductInformation().getStarted.sections.length > 1 && renderButtonBar()}\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n {renderChecks()}\r\n
\r\n \r\n {/* Icon */}\r\n
\r\n );\r\n};\r\n","export enum ClientType {\r\n\tmobile,\r\n\tdesktop,\r\n\tssr,\r\n}\r\n\r\nexport abstract class Functions {\r\n\tpublic static GetClientType = (userAgent: NavigatorID['userAgent']) => {\r\n\t\tlet isAndroid = Boolean(userAgent.match(/Android/i));\r\n\t\tlet isIos = Boolean(userAgent.match(/iPhone|iPad|iPod/i));\r\n\t\tlet isOpera = Boolean(userAgent.match(/Opera Mini/i));\r\n\t\tlet isWindows = Boolean(userAgent.match(/IEMobile/i));\r\n\t\tlet isSSR = Boolean(userAgent.match(/SSR/i));\r\n\t\tlet clientType: ClientType = ClientType.ssr;\r\n\t\tif (Boolean(isAndroid || isIos || isOpera || isWindows)) clientType = ClientType.mobile;\r\n\t\telse if (Boolean(!isSSR)) clientType = ClientType.desktop;\r\n\r\n\t\treturn clientType;\r\n\t};\r\n}\r\n","import { GetQueryParameter } from \"./Url\";\r\n\r\nexport const checkLanguageGerman = () => {\r\n if (GetQueryParameter(\"locale\").startsWith(\"de\") || GetQueryParameter(\"language\") === \"de\") {\r\n return true;\r\n }\r\n return false;\r\n}","import { Button, Flex, PlayIcon, PopupIcon, Text } from \"@fluentui/react-northstar\";\r\nimport React, { useState } from \"react\";\r\nimport { FunctionComponent } from \"react\";\r\nimport { FormattedMessage } from \"react-intl\";\r\nimport { ClientType, Functions } from \"../../../../../../GlobalComponents/Functions\";\r\nimport style from \"./CustomHeader.module.scss\"\r\nimport { checkLanguageGerman } from \"../../../../../../Utilities/Language\";\r\nimport { getSelectedProductInformation } from \"../../../../../../Utilities/Product\";\r\n\r\ninterface HeaderProps {\r\n}\r\n\r\nconst CustomHeader: FunctionComponent{icon}
\r\n\r\n {/* Title */}\r\n \r\n \r\n
\r\n {/* Description */}\r\n\r\n \r\n \r\n
\r\n \r\n {getSelectedProductInformation().information.logo ? 
: {getSelectedProductInformation().information.title} }\r\n
\r\n \r\n \r\n \r\n\r\n {/* Schedule a Demo Button */}\r\n \r\n\r\n
\r\n \r\n\r\n {/* CustomHeader Video */}\r\n \r\n
}\r\n />\r\n\r\n \r\n\r\n {/*CustomHeader Heading */}\r\n
}\r\n id={style.HeaderTitle}\r\n />\r\n\r\n {/*Info Text to the heading */}\r\n \r\n {getSelectedProductInformation().getStarted.header.german.videoLink && getSelectedProductInformation().getStarted.header.english.videoLink &&
\r\n\r\n \r\n \r\n { checkLanguageGerman() ? window.open(getSelectedProductInformation().getStarted.header.german.videoLink, \"_blank\") : window.open(getSelectedProductInformation().getStarted.header.english.videoLink, \"_blank\") }}>
}\r\n \r\n {getSelectedProductInformation().getStarted.specifications.map(\r\n (data, index) => {\r\n const Icon = icon?.[data.icon];\r\n return (\r\n
\r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nexport default injectIntl(GetStarted);\r\n","import cssStyle from \"./BackgroundPanel.module.scss\"\r\nimport React,{ FunctionComponent } from \"react\";\r\n\r\ninterface BackgroundPanelProps {\r\n children:React.ReactNode\r\n primary?:boolean,\r\n className?:string\r\n}\r\n \r\nconst BackgroundPanel: FunctionComponent\r\n {children}\r\n
\r\n );\r\n}\r\n \r\nexport default BackgroundPanel;","import { FunctionComponent } from \"react\";\r\nimport BackgroundPanel from \"../BackgroundPanel/BackgroundPanel\";\r\nimport cssStyles from \"./CardBackgroundPanel.module.scss\";\r\nimport React from \"react\";\r\n\r\ninterface CardBackgroundPanelProps {\r\n children: React.ReactNode;\r\n primary?: boolean;\r\n}\r\n\r\nconst CardBackgroundPanel: FunctionComponent\r\n {/* Video Card */}\r\n \r\n \r\n\r\n {/* Video Player Overlay */}\r\n
\r\n );\r\n}\r\n","import * as React from \"react\";\r\n\r\nimport { VideoCard } from \"./components/VideoCard/VideoCard\";\r\nimport cssStyles from \"./VideoTrainings.module.scss\";\r\nimport Videos from \"./Videos.json\";\r\nimport { checkLanguageGerman } from \"../../../../Utilities/Language\";\r\n\r\ninterface VideoTrainingProps {}\r\n\r\nconst VideoTraining: React.FunctionComponent\r\n
\r\n \r\n
\r\n \r\n
setVideoCardOverlay(style.ShowVideoCardOverlay)}>
\r\n \r\n
\r\n \r\n
\r\n \r\n } /> \r\n
\r\n \r\n
\r\n \r\n {videos.map((video) => (\r\n \r\n ))}\r\n
\r\n );\r\n};\r\n\r\nexport default VideoTraining;\r\n","import React, { FunctionComponent } from \"react\";\r\nimport {\r\n Button,\r\n PopupIcon,\r\n Text,\r\n} from \"@fluentui/react-northstar\";\r\nimport cssStyles from \"./HeaderBanner.module.scss\";\r\nimport { FormattedMessage } from \"react-intl\";\r\n\r\nmicrosoftTeams.initialize();\r\ntype HeaderBannerContentTypes = {\r\n categoryTextId:string,\r\n categoryTextAlt:string,\r\n productTitleId:string,\r\n productTitleAlt:string,\r\n productDescriptionId:string,\r\n productDescriptionAlt:string,\r\n imgUrl:string,\r\n LearnMore:string;\r\n }\r\n\r\nexport const HeaderBannerContent:FunctionComponent\r\n
\r\n\r\n );\r\n};\r\n","import React, { useState } from \"react\";\r\nimport cssStyles from \"./HeaderBanner.module.scss\";\r\nimport { ChevronEndIcon, ChevronStartIcon } from \"@fluentui/react-northstar\";\r\nimport Products from \"../../ProductsList.json\"\r\nimport { HeaderBannerContent } from \"./HeaderBannerContent\";\r\nimport { checkLanguageGerman } from \"../../../../../../Utilities/Language\";\r\nexport const HeaderBanner = () => {\r\n const [selectedHeaderContent, setSelectedHeaderContent] = useState(0)\r\n\r\n const leftButtonPressed = () => {\r\n setSelectedHeaderContent(selectedHeaderContent - 1)\r\n }\r\n\r\n const rightButtonPressed = () => {\r\n setSelectedHeaderContent(selectedHeaderContent + 1)\r\n }\r\n\r\n const dotPressed = (index: number) => {\r\n setSelectedHeaderContent(index)\r\n }\r\n\r\n return (\r\n \r\n\r\n\r\n \r\n\r\n
\r\n \r\n \r\n \r\n \r\n }\r\n primary\r\n onClick={() => {\r\n window.open(LearnMore, \"_blank\");\r\n }}\r\n />\r\n
\r\n \r\n {/* Small info Heading */}\r\n \r\n }\r\n />\r\n\r\n {/* External User Manager Heading */}\r\n \r\n }\r\n />\r\n\r\n {/* Description */}\r\n \r\n }\r\n />
\r\n\r\n {/* Learn more Button */}\r\n \r\n
\r\n );\r\n};\r\n","import React from 'react';\r\nimport { Button, PopupIcon, Image } from \"@fluentui/react-northstar\";\r\nimport style from \"./ProductCard.module.scss\";\r\nimport {\r\n FormattedMessage,\r\n} from \"react-intl\";\r\n//Properties of Product Card module\r\ntype ProductCardProps = {\r\n title: string,\r\n text: string,\r\n translationHeaderID: string,\r\n translationTextID: string,\r\n img: string,\r\n url: string,\r\n}\r\n\r\n//Main\r\nexport const ProductCard: React.FC\r\n
\r\n \r\n {\r\n
\r\n \r\n {Products.HeaderContents.map((_, index) => (\r\n \r\n ))}\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n );\r\n}\r\n\r\n","import * as React from \"react\";\r\nimport style from \"./MoreProducts.module.scss\";\r\nimport {\r\n FormattedMessage,\r\n injectIntl,\r\n WrappedComponentProps,\r\n} from \"react-intl\";\r\n\r\nimport Products from \"./ProductsList.json\";\r\nimport { HeaderBanner } from \"./components/HeaderBanner/HeaderBanner\";\r\nimport { ProductCard } from \"./components/ProductCard/ProductCard\";\r\nimport { checkLanguageGerman } from \"../../../../Utilities/Language\";\r\n\r\ninterface MoreProductsProps {}\r\n\r\nclass MoreProducts extends React.Component<\r\n MoreProductsProps & WrappedComponentProps\r\n> {\r\n render() {\r\n return (\r\n <>\r\n {/* Adding Header Banner module */}\r\n \r\n
\r\n\r\n \r\n\r\n {/* Product Card Image */}\r\n
\r\n \r\n {/* Title */}\r\n
\r\n \r\n
\r\n {/* Description */}\r\n\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nexport default injectIntl(MoreProducts);\r\n","import * as React from 'react';\r\nimport { FormattedMessage, injectIntl, WrappedComponentProps } from 'react-intl';\r\nimport style from \"../../AboutS2S.module.scss\";\r\n\r\n\r\ninterface ExpertiseProps {\r\n}\r\n\r\nclass Expertise extends React.Component\r\n {Products.Categories.map((Category, index) => (\r\n
\r\n \r\n
\r\n ))}\r\n \r\n \r\n
\r\n {Products.Categories[index].Products.map((Product) => (\r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nexport default injectIntl(Expertise);","import React, { useEffect, useState } from 'react';\r\n\r\ntype CounterProps = {\r\n number: string,\r\n duration: string\r\n }\r\n\r\nconst Counter = ({ number, duration }: CounterProps) => {\r\n\r\n // number displayed by component\r\n const [count, setCount] = useState(\"0\")\r\n\r\n useEffect(() => {\r\n let start = 0;\r\n // first three numbers from props\r\n const end = parseInt(number.substring(0,3))\r\n // if zero, return\r\n if (start === end) return;\r\n\r\n // find duration per increment\r\n let totalMilSecDur = parseInt(duration);\r\n let incrementTime = (totalMilSecDur / end) * 1000;\r\n\r\n // timer increments start counter \r\n // then updates count\r\n // ends if start reaches end\r\n let timer = setInterval(() => {\r\n start += 1;\r\n setCount(String(start) + number.substring(3))\r\n if (start === end) clearInterval(timer) \r\n }, incrementTime);\r\n\r\n // dependency array\r\n }, [number, duration]);\r\n\r\n return (\r\n <>{count});\r\n}\r\n\r\nexport default Counter;","import * as React from 'react';\r\nimport { injectIntl, WrappedComponentProps } from 'react-intl';\r\nimport style from \"../../AboutS2S.module.scss\";\r\nimport Counter from '../../../../../../GlobalComponents/Counter/Counter';\r\nimport GeneralInformation from \"../../../../../GeneralInformations.json\"\r\n\r\ninterface FrameProps {\r\n}\r\n\r\nclass Frame extends React.Component\r\n
\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default injectIntl(Frame);\r\n","import * as React from 'react';\r\nimport { FormattedMessage, injectIntl, WrappedComponentProps } from 'react-intl';\r\nimport style from \"../../AboutS2S.module.scss\";\r\n\r\n\r\ninterface HeadPictureProps {\r\n}\r\n\r\ninterface HeadPictureState {\r\n\r\n}\r\n\r\nclass HeadPicture extends React.Component\r\n
\r\n\r\n {this.props.intl.formatMessage({id: 'Common.YearsExperience', defaultMessage:'Years Experience'}).toUpperCase()}
\r\n\r\n
\r\n\r\n {this.props.intl.formatMessage({id: 'Common.Partners', defaultMessage:'Partners'}).toUpperCase()}
\r\n\r\n
\r\n\r\n {this.props.intl.formatMessage({id: 'Common.Countries', defaultMessage:'Countries'}).toUpperCase()}
\r\n\r\n
\r\n {this.props.intl.formatMessage({id: 'Common.Installations', defaultMessage:'Installations'}).toUpperCase()}
\r\n\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default injectIntl(HeadPicture);","import * as React from 'react';\r\nimport style from \"../../AboutS2S.module.scss\";\r\nimport { FormattedMessage, injectIntl, WrappedComponentProps } from 'react-intl';\r\n\r\ninterface OurStoryProps {\r\n}\r\n\r\nclass OurStory extends React.Component\r\n\r\n ![Logo]({window.location.origin+\"/img/General/logo.png\"})
\r\n\r\n
\r\n \r\n\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nexport default injectIntl(OurStory);","import * as React from 'react';\r\nimport { injectIntl, WrappedComponentProps } from 'react-intl';\r\nimport style from \"../../AboutS2S.module.scss\";\r\n\r\nclass Partner extends React.Component<{} & WrappedComponentProps> {\r\n render() {\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default injectIntl(Partner);","import * as React from \"react\";\r\nimport { injectIntl, WrappedComponentProps } from \"react-intl\";\r\nimport style from \"./Person.module.scss\";\r\n\r\ninterface TeamComponentProps {\r\n name: string;\r\n desc?: string;\r\n}\r\n\r\nclass TeamComponent extends React.Component<\r\n TeamComponentProps & WrappedComponentProps\r\n> {\r\n render() {\r\n return (\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default injectIntl(TeamComponent);\r\n","import * as React from \"react\";\r\nimport style from \"../../AboutS2S.module.scss\";\r\nimport TeamComponent from \"./Person/Person\";\r\nimport members from \"./team.json\";\r\nimport {\r\n FormattedMessage,\r\n injectIntl,\r\n WrappedComponentProps,\r\n} from \"react-intl\";\r\n\r\ninterface TeamProps {}\r\n\r\ninterface TeamState {}\r\n\r\nclass Team extends React.Component<\r\n TeamProps & WrappedComponentProps,\r\n TeamState\r\n> {\r\n getRandomName(array: string[]) {\r\n const randIndex = Math.floor(Math.random() * array.length);\r\n const name = array[randIndex];\r\n return name;\r\n }\r\n\r\n renderHeader() {\r\n return (\r\n <>\r\n {members.head.map((value, i) => (\r\n {this.props.name}
\r\n{this.props.desc}
\r\n\r\n \r\n
\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default injectIntl(Team);\r\n","import * as React from \"react\";\r\nimport Expertise from \"./components/Expertise/Expertise\";\r\nimport Frame from \"./components/Frame/Frame\";\r\nimport HeadPicture from \"./components/HeadPicture/HeadPicture\";\r\nimport OurStory from \"./components/OurStory/OurStory\";\r\nimport Partner from \"./components/Partner/Partner\";\r\nimport Team from \"./components/Team/Team\";\r\n\r\ninterface Props {\r\n}\r\n\r\nclass AboutS2S extends React.Component\r\n
\r\n \r\n
\r\n\r\n \r\n
{this.renderHeader()}
\r\n\r\n {this.renderTeam()}
\r\n \r\n
\r\n \r\n {getSelectedProductInformation().information.title}\r\n
\r\n \r\n {Object.entries(productsJson.Products).map((productSection) => (\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default ProductsDropdown;\r\n","import { ArrowLeftIcon } from \"@fluentui/react-northstar\";\r\nimport React from \"react\";\r\nimport { FunctionComponent } from \"react\";\r\nimport { FormattedMessage } from \"react-intl\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { getAllQueryParameters } from \"../../Utilities/Url\";\r\nimport LanguageDropdown from \"../LanguageDropdown/LanguageDropdown\";\r\nimport ProductsDropdown from \"../ProductsDropdown/ProductsDropdown\";\r\nimport cssStyles from \"./Nav.module.scss\";\r\n\r\ninterface PagesNavBarProps {\r\n show: boolean;\r\n targetUrl: string;\r\n}\r\n\r\nconst PagesNavBar: FunctionComponent\r\n {productSection[1].information.title}\r\n
\r\n \r\n ))}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n ) : null;\r\n};\r\n\r\nexport default PagesNavBar;\r\n","import React, { FunctionComponent, useEffect, useState } from \"react\";\r\nimport {\r\n Button,\r\n Text,\r\n Image,\r\n PlayIcon,\r\n Provider,\r\n teamsDarkV2Theme,\r\n} from \"@fluentui/react-northstar\";\r\nimport TeamsManagerLogoVideoCardDark from \"./img/TeamsManagerLogoVideoCardDark.png\";\r\nimport style from \"../../VideoTrainings.module.scss\";\r\nimport {\r\n FormattedMessage,\r\n WrappedComponentProps,\r\n injectIntl,\r\n} from \"react-intl\";\r\nimport YouTube from \"react-youtube\";\r\nimport CardBackgroundPanel from \"../../../../../../GlobalComponents/CardBackgroundPanel/CardBackgroundPanel\";\r\n\r\n// Video Card Props\r\ntype VideoCardProps = {\r\n text: string;\r\n videoID: string;\r\n translationTextID: string;\r\n};\r\n\r\nconst VideoCardUser: FunctionComponent<\r\n VideoCardProps & WrappedComponentProps\r\n> = ({\r\n text,\r\n videoID,\r\n translationTextID,\r\n intl,\r\n}: VideoCardProps & WrappedComponentProps) => {\r\n const [VideoCardOverlayState, setVideoCardOverlay] = useState(\r\n style.DisableVideoCardOverlay\r\n );\r\n const [VideoPlayerState, setVideoPlayerState] = useState([]);\r\n\r\n //Getting ESC Key\r\n const escFunction = (event) => {\r\n if (event.keyCode === 27) {\r\n setVideoCardOverlay(style.DisableVideoCardOverlay);\r\n pauseVideos();\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n document.addEventListener(\"keydown\", escFunction);\r\n\r\n return () => {\r\n document.removeEventListener(\"keydown\", escFunction);\r\n };\r\n });\r\n\r\n function getReadyVideos(event) {\r\n const player = VideoPlayerState;\r\n player.push(event.target);\r\n setVideoPlayerState(player);\r\n }\r\n\r\n function pauseVideos() {\r\n VideoPlayerState.forEach((player) => {\r\n player.pauseVideo();\r\n });\r\n }\r\n\r\n return (\r\n
\r\n {/* Video Card */}\r\n \r\n
\r\n \r\n {/* Video Player Overlay */}\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n setVideoCardOverlay(style.ShowVideoCardOverlay)}\r\n >\r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default injectIntl(VideoCardUser);\r\n","import React from \"react\";\r\nimport cssStyles from \"./SiteHeading.module.scss\";\r\nimport { FunctionComponent } from \"react\";\r\nimport { FormattedMessage } from \"react-intl\";\r\n\r\ninterface SiteHeadingProps {\r\n headingId: string\r\n descriptionId: string\r\n headingAlternativeText?: string\r\n descriptionAlternativeText?: string\r\n}\r\n\r\nconst SiteHeading: FunctionComponent\r\n
\r\n \r\n \r\n \r\n \r\n {\r\n setVideoCardOverlay(style.DisableVideoCardOverlay);\r\n pauseVideos();\r\n }}\r\n content={\r\n \r\n
\r\n \r\n \r\n
\r\n }\r\n />\r\n \r\n
\r\n \r\n
\r\n \r\n Creation Process
,\r\n content: handleCreation(),\r\n },\r\n {\r\n key: \"2\",\r\n title:Approval Process
,\r\n content: handleApprovalProcess(),\r\n },\r\n {\r\n key: \"3\",\r\n title:Extending Lifecycle
,\r\n content: handleExtendingLifecycle(),\r\n },\r\n ];\r\n\r\n function handleCreation() {\r\n var creation = Videos.Creation.map((video) => (\r\n{creation}
;\r\n }\r\n\r\n function handleApprovalProcess() {\r\n var approval = Videos.ApprovalProcess.map((video) => (\r\n {approval}
;\r\n }\r\n function handleExtendingLifecycle() {\r\n var extendingLifeCycle = Videos.ExtendingLifeCycle.map((video) => (\r\n {extendingLifeCycle}
;\r\n }\r\n return (\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default VideoTrainingUser;\r\n","import { FunctionComponent } from \"react\";\r\nimport cssStyles from \"./SquareButton.module.scss\";\r\nimport React from \"react\";\r\n\r\ninterface SquareButtonProps {\r\n text: string\r\n onClick: () => void,\r\n active?: boolean\r\n}\r\n \r\nconst SquareButton: FunctionComponent\r\n
\r\n );\r\n};\r\n\r\nexport default ScoreSelector;\r\n","import { FunctionComponent } from \"react\";\r\nimport cssStyles from \"./TextArea.module.scss\";\r\nimport React from \"react\";\r\nimport { WrappedComponentProps, injectIntl } from \"react-intl\";\r\n\r\ninterface TextAreaProps {\r\n placeholderTextId?: string;\r\n altPlaceholderText?: string;\r\n className?: string;\r\n}\r\n\r\nconst TextArea: FunctionComponent\r\n {scores.map((score, index) => (\r\n setSelected(from + index)} />\r\n ))}\r\n
\r\n \r\n
\r\n \r\n \r\n }\r\n primary\r\n />\r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default Workshop;\r\n","import {pdfjs} from \"react-pdf\"\r\n\r\nexport function getPdfWorkerPath(){\r\n return `https://cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`\r\n}","import React, { useState, useEffect } from \"react\";\r\nimport cssStyles from \"./Product.module.scss\";\r\nimport {\r\n FormattedMessage,\r\n injectIntl,\r\n WrappedComponentProps,\r\n} from \"react-intl\";\r\nimport {\r\n CallIcon,\r\n VolumeIcon,\r\n NotesIcon,\r\n PlayIcon,\r\n RedbangIcon,\r\n TenantPersonalIcon,\r\n ToDoListIcon,\r\n LockIcon,\r\n CallVideoIcon,\r\n InfoIcon,\r\n PlugsIcon,\r\n} from \"@fluentui/react-icons-northstar\";\r\nimport { OptionCategory } from \"../../Types/OptionCategory\";\r\nimport { GetQueryParameter } from \"../../Utilities/Url\";\r\nimport GetStarted from \"./pages/GetStarted/GetStarted\";\r\nimport VideoTraining from \"./pages/VideoTrainings/VideoTrainings\";\r\nimport MoreProducts from \"./pages/MoreProducts/MoreProducts\";\r\nimport AboutS2S from \"./pages/AboutS2SContainer/AboutS2S\";\r\nimport PagesNavBar from \"../../GlobalComponents/Nav/Nav\";\r\nimport Footer from \"../../GlobalComponents/Footer/Footer\";\r\nimport VideoTrainingUser from \"./pages/VideoTrainings/VideoTrainingUser\";\r\nimport GiveUsFeedback from \"./pages/GiveUsFeedback/GiveUsFeedback\";\r\nimport {\r\n getGeneralInformation,\r\n getSelectedProductInformation,\r\n getSelectedProductName,\r\n} from \"../../Utilities/Product\";\r\nimport SidebarItem from \"./SidebarItem\";\r\nimport Workshop from \"./pages/Workshop/Workshop\";\r\nimport { isInTeams } from \"../../Utilities/TeamsCheck\";\r\n\r\nexport interface IProductContentProps {}\r\n\r\nexport interface IProductContentState {\r\n option: OptionCategory;\r\n isInTeams: boolean;\r\n menuOpen: boolean;\r\n role: string;\r\n}\r\n\r\nconst ProductContent: React.FC\r\n
\r\n );\r\n };\r\n\r\n const renderSidebarItems = () => {\r\n const { role } = state;\r\n const settingsItems: React.ReactElement[] = [];\r\n const informationItems: React.ReactElement[] = [];\r\n\r\n const createSidebarItem = (\r\n option: OptionCategory,\r\n icon: React.ReactElement,\r\n title: string,\r\n titleTranslationId: string\r\n ) => (\r\n \r\n
\r\n \r\n \r\n );\r\n};\r\n\r\nexport default injectIntl(ProductContent);\r\n","import React from \"react\";\r\nimport ProductContent from \"./ProductContent\";\r\nimport { GetQueryParameter } from \"../../Utilities/Url\";\r\nimport { GetContext } from \"../../Utilities/TeamsContextHandler\";\r\nimport { setSelectedProduct } from \"../../Utilities/Product\";\r\n\r\nexport interface IProductState {\r\n teamsContext: microsoftTeams.Context;\r\n}\r\n\r\nexport interface IProductProps {\r\n product: string;\r\n}\r\n\r\nexport class Product extends React.Component\r\n document.getElementById(\"MenuButton\")?.focus()}\r\n />\r\n document.getElementById(\"MenuButton\")?.focus()}\r\n >\r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n - {renderSidebarItems()}
{renderFrame(state.option)}
\r\n