mirror of
https://github.com/tiqi-group/pydase.git
synced 2025-06-08 14:30:41 +02:00
57 lines
1.6 KiB
TypeScript
57 lines
1.6 KiB
TypeScript
import React from "react";
|
|
import { LevelName } from "./NotificationsComponent";
|
|
import { DataServiceComponent, DataServiceJSON } from "./DataServiceComponent";
|
|
import { MethodComponent } from "./MethodComponent";
|
|
|
|
interface DeviceConnectionProps {
|
|
fullAccessPath: string;
|
|
props: DataServiceJSON;
|
|
isInstantUpdate: boolean;
|
|
addNotification: (message: string, levelname?: LevelName) => void;
|
|
displayName: string;
|
|
id: string;
|
|
}
|
|
|
|
export const DeviceConnectionComponent = React.memo(
|
|
({
|
|
fullAccessPath,
|
|
props,
|
|
isInstantUpdate,
|
|
addNotification,
|
|
displayName,
|
|
id,
|
|
}: DeviceConnectionProps) => {
|
|
const { connected, connect, ...updatedProps } = props;
|
|
const connectedVal = connected.value;
|
|
|
|
return (
|
|
<div className="deviceConnectionComponent" id={id}>
|
|
{!connectedVal && (
|
|
<div className="overlayContent">
|
|
<div>
|
|
{displayName != "" ? displayName : "Device"} is currently not available!
|
|
</div>
|
|
<MethodComponent
|
|
fullAccessPath={`${fullAccessPath}.connect`}
|
|
docString={connect.doc}
|
|
addNotification={addNotification}
|
|
displayName={"reconnect"}
|
|
id={id + "-connect"}
|
|
render={true}
|
|
/>
|
|
</div>
|
|
)}
|
|
<DataServiceComponent
|
|
props={updatedProps}
|
|
isInstantUpdate={isInstantUpdate}
|
|
addNotification={addNotification}
|
|
displayName={displayName}
|
|
id={id}
|
|
/>
|
|
</div>
|
|
);
|
|
},
|
|
);
|
|
|
|
DeviceConnectionComponent.displayName = "DeviceConnectionComponent";
|