1 import { Component } from "inferno";
3 GetFederatedInstancesResponse,
9 } from "lemmy-js-client";
10 import { Subscription } from "rxjs";
11 import { i18n } from "../../i18next";
12 import { InitialFetchRequest } from "../../interfaces";
13 import { WebSocketService } from "../../services";
22 import { HtmlTags } from "../common/html-tags";
24 interface InstancesState {
25 siteRes: GetSiteResponse;
26 instancesRes?: GetFederatedInstancesResponse;
30 export class Instances extends Component<any, InstancesState> {
31 private isoData = setIsoData(this.context);
32 state: InstancesState = {
33 siteRes: this.isoData.site_res,
36 private subscription?: Subscription;
38 constructor(props: any, context: any) {
39 super(props, context);
41 this.parseMessage = this.parseMessage.bind(this);
42 this.subscription = wsSubscribe(this.parseMessage);
44 // Only fetch the data if coming from another route
45 if (this.isoData.path == this.context.router.route.match.url) {
48 instancesRes: this.isoData
49 .routeData[0] as GetFederatedInstancesResponse,
53 WebSocketService.Instance.send(wsClient.getFederatedInstances({}));
57 static fetchInitialData(req: InitialFetchRequest): Promise<any>[] {
58 let promises: Promise<any>[] = [];
60 promises.push(req.client.getFederatedInstances({}));
65 get documentTitle(): string {
66 return `${i18n.t("instances")} - ${this.state.siteRes.site_view.site.name}`;
69 componentWillUnmount() {
71 this.subscription?.unsubscribe();
76 let federated_instances = this.state.instancesRes?.federated_instances;
77 return federated_instances ? (
78 <div className="container-lg">
80 title={this.documentTitle}
81 path={this.context.router.route.match.url}
84 <div className="col-md-6">
85 <h5>{i18n.t("linked_instances")}</h5>
86 {this.itemList(federated_instances.linked)}
88 {federated_instances.allowed &&
89 federated_instances.allowed.length > 0 && (
90 <div className="col-md-6">
91 <h5>{i18n.t("allowed_instances")}</h5>
92 {this.itemList(federated_instances.allowed)}
95 {federated_instances.blocked &&
96 federated_instances.blocked.length > 0 && (
97 <div className="col-md-6">
98 <h5>{i18n.t("blocked_instances")}</h5>
99 {this.itemList(federated_instances.blocked)}
109 itemList(items: Instance[]) {
110 return items.length > 0 ? (
111 <div className="table-responsive">
112 <table id="instances_table" className="table table-sm table-hover">
113 <thead className="pointer">
115 <th>{i18n.t("name")}</th>
116 <th>{i18n.t("software")}</th>
117 <th>{i18n.t("version")}</th>
124 <a href={`https://${i.domain}`} rel={relTags}>
128 <td>{i.software}</td>
136 <div>{i18n.t("none_found")}</div>
139 parseMessage(msg: any) {
140 let op = wsUserOp(msg);
143 toast(i18n.t(msg.error), "danger");
144 this.context.router.history.push("/");
145 this.setState({ loading: false });
147 } else if (op == UserOperation.GetFederatedInstances) {
148 let data = wsJsonToRes<GetFederatedInstancesResponse>(msg);
149 this.setState({ loading: false, instancesRes: data });