import { Component, linkEvent } from "inferno"; import { Helmet } from "inferno-helmet"; import { i18n } from "../i18next"; import { T } from "inferno-i18next"; import { BottomSpacer, SELECT_CLASSES, TEXT_GRADIENT } from "./common"; import { API_LIBRARIES, APP_LIST, AppDetails, AppLink, Platform, SourceType, } from "./app-definitions"; import { Icon } from "./icon"; import { I18nKeys } from "i18next"; const TitleBlock = () => (
##

{i18n.t("choose_from_apps")}

); interface AppDetailsCardProps { app: AppDetails; } const AppDetailsTitle = ({ app }: AppDetailsCardProps) => (
{app.name}
); interface AppDetailsButtonsProps { links: AppLink[]; } const AppDetailsButtons = ({ links }: AppDetailsButtonsProps) => (
{links.map(l => ( ))}
); const AppDetailsCard = ({ app }: AppDetailsCardProps) => (

{app.description}

{app.sourceType == SourceType.Closed && (
{i18n.t("closed_source_warning")}
)}
); const AppTitle = ({ title }) => (
{title}
); interface AppGridProps { apps: AppDetails[]; } const AppGrid = ({ apps }: AppGridProps) => (
{apps.map(a => ( ))}
); const ApiLibrariesBlock = () => (
    {API_LIBRARIES.map(a => (
  • {a.name} - {a.description}
  • ))}
); interface State { apps: AppDetails[]; platform: Platform; } export class Apps extends Component { state: State = { apps: [], platform: Platform.All, }; constructor(props: any, context: any) { super(props, context); } componentDidMount() { window.scrollTo(0, 0); this.buildAppList(); } buildAppList() { let apps = APP_LIST; // Platform filter if (this.state.platform !== Platform.All) { apps = apps.filter(a => a.platforms.includes(this.state.platform)); } this.setState({ apps }); } render() { const title = i18n.t("apps_title"); return (
{this.filterAndTitleBlock()}
); } filterAndTitleBlock() { return ( ); } } function handlePlatformChange(i: Apps, event: any) { let platform: Platform = (event.target.value as Platform) ?? Platform.All; i.setState({ platform, }); i.buildAppList(); }