import { Component } from "inferno"; import { GetFederatedInstancesResponse, GetSiteResponse, Instance, } from "lemmy-js-client"; import { i18n } from "../../i18next"; import { InitialFetchRequest } from "../../interfaces"; import { FirstLoadService } from "../../services/FirstLoadService"; import { HttpService, RequestState } from "../../services/HttpService"; import { RouteDataResponse, relTags, setIsoData } from "../../utils"; import { HtmlTags } from "../common/html-tags"; import { Spinner } from "../common/icon"; type InstancesData = RouteDataResponse<{ federatedInstancesResponse: GetFederatedInstancesResponse; }>; interface InstancesState { instancesRes: RequestState; siteRes: GetSiteResponse; isIsomorphic: boolean; } export class Instances extends Component { private isoData = setIsoData(this.context); state: InstancesState = { instancesRes: { state: "empty" }, siteRes: this.isoData.site_res, isIsomorphic: false, }; constructor(props: any, context: any) { super(props, context); // Only fetch the data if coming from another route if (FirstLoadService.isFirstLoad) { this.state = { ...this.state, instancesRes: this.isoData.routeData.federatedInstancesResponse, isIsomorphic: true, }; } } async componentDidMount() { if (!this.state.isIsomorphic) { await this.fetchInstances(); } } async fetchInstances() { this.setState({ instancesRes: { state: "loading" }, }); this.setState({ instancesRes: await HttpService.client.getFederatedInstances({}), }); } static async fetchInitialData({ client, }: InitialFetchRequest): Promise { return { federatedInstancesResponse: await client.getFederatedInstances({}), }; } get documentTitle(): string { return `${i18n.t("instances")} - ${this.state.siteRes.site_view.site.name}`; } renderInstances() { switch (this.state.instancesRes.state) { case "loading": return (
); case "success": { const instances = this.state.instancesRes.data.federated_instances; return instances ? (
{i18n.t("linked_instances")}
{this.itemList(instances.linked)}
{instances.allowed && instances.allowed.length > 0 && (
{i18n.t("allowed_instances")}
{this.itemList(instances.allowed)}
)} {instances.blocked && instances.blocked.length > 0 && (
{i18n.t("blocked_instances")}
{this.itemList(instances.blocked)}
)}
) : ( <> ); } } } render() { return (
{this.renderInstances()}
); } itemList(items: Instance[]) { return items.length > 0 ? (
{items.map(i => ( ))}
{i18n.t("name")} {i18n.t("software")} {i18n.t("version")}
{i.domain} {i.software} {i.version}
) : (
{i18n.t("none_found")}
); } }