mirror of
https://github.com/wavetermdev/waveterm.git
synced 2025-01-02 18:39:05 +01:00
fix useWidth usage, use overlayref directly
This commit is contained in:
parent
a00dc5682e
commit
c00749efeb
@ -1,7 +1,7 @@
|
||||
// Copyright 2024, Command Line Inc.
|
||||
// SPDX-License-Identifier: Apache-2.0
|
||||
|
||||
import { BlockComponentModel, BlockProps } from "@/app/block/blocktypes";
|
||||
import { BlockComponentModel2, BlockProps } from "@/app/block/blocktypes";
|
||||
import { PlotView } from "@/app/view/plotview/plotview";
|
||||
import { PreviewModel, PreviewView, makePreviewModel } from "@/app/view/preview/preview";
|
||||
import { ErrorBoundary } from "@/element/errorboundary";
|
||||
@ -220,7 +220,7 @@ const BlockFull = React.memo(({ nodeModel, viewModel }: FullBlockProps) => {
|
||||
focusElemRef.current?.focus({ preventScroll: true });
|
||||
}, []);
|
||||
|
||||
const blockModel: BlockComponentModel = {
|
||||
const blockModel: BlockComponentModel2 = {
|
||||
onClick: setBlockClickedTrue,
|
||||
onFocusCapture: handleChildFocus,
|
||||
blockRef: blockRef,
|
||||
|
@ -1,7 +1,6 @@
|
||||
// Copyright 2024, Command Line Inc.
|
||||
// SPDX-License-Identifier: Apache-2.0
|
||||
|
||||
import { BlockComponentModel } from "@/app/block/blocktypes";
|
||||
import {
|
||||
blockViewToIcon,
|
||||
blockViewToName,
|
||||
@ -266,12 +265,10 @@ function renderHeaderElements(headerTextUnion: HeaderElem[], preview: boolean):
|
||||
|
||||
const ConnStatusOverlay = React.memo(
|
||||
({
|
||||
blockModel,
|
||||
nodeModel,
|
||||
viewModel,
|
||||
changeConnModalAtom,
|
||||
}: {
|
||||
blockModel: BlockComponentModel;
|
||||
nodeModel: NodeModel;
|
||||
viewModel: ViewModel;
|
||||
changeConnModalAtom: jotai.PrimitiveAtom<boolean>;
|
||||
@ -281,8 +278,10 @@ const ConnStatusOverlay = React.memo(
|
||||
const connName = blockData.meta?.connection;
|
||||
const connStatus = jotai.useAtomValue(getConnStatusAtom(connName));
|
||||
const isLayoutMode = jotai.useAtomValue(atoms.controlShiftDelayAtom);
|
||||
const width = useWidth(blockModel?.blockRef);
|
||||
const overlayRef = React.useRef<HTMLDivElement>(null);
|
||||
const width = useWidth(overlayRef);
|
||||
const [showError, setShowError] = React.useState(false);
|
||||
const blockNum = jotai.useAtomValue(nodeModel.blockNum);
|
||||
|
||||
React.useEffect(() => {
|
||||
if (width) {
|
||||
@ -319,7 +318,7 @@ const ConnStatusOverlay = React.memo(
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="connstatus-overlay">
|
||||
<div className="connstatus-overlay" ref={overlayRef}>
|
||||
<div className="connstatus-content">
|
||||
<div className={clsx("connstatus-status-icon-wrapper", { "has-error": showError })}>
|
||||
{showIcon && <i className="fa-solid fa-triangle-exclamation"></i>}
|
||||
@ -443,12 +442,13 @@ const BlockFrame_Default_Component = (props: BlockFrameProps) => {
|
||||
ref={blockModel?.blockRef}
|
||||
>
|
||||
<BlockMask nodeModel={nodeModel} />
|
||||
<ConnStatusOverlay
|
||||
blockModel={blockModel}
|
||||
nodeModel={nodeModel}
|
||||
viewModel={viewModel}
|
||||
changeConnModalAtom={changeConnModalAtom}
|
||||
/>
|
||||
{preview ? null : (
|
||||
<ConnStatusOverlay
|
||||
nodeModel={nodeModel}
|
||||
viewModel={viewModel}
|
||||
changeConnModalAtom={changeConnModalAtom}
|
||||
/>
|
||||
)}
|
||||
<div className="block-frame-default-inner" style={innerStyle}>
|
||||
<BlockFrame_Header {...props} connBtnRef={connBtnRef} changeConnModalAtom={changeConnModalAtom} />
|
||||
{preview ? previewElem : children}
|
||||
|
@ -7,14 +7,14 @@ export interface BlockProps {
|
||||
nodeModel: NodeModel;
|
||||
}
|
||||
|
||||
export interface BlockComponentModel {
|
||||
export interface BlockComponentModel2 {
|
||||
onClick?: () => void;
|
||||
onFocusCapture?: React.FocusEventHandler<HTMLDivElement>;
|
||||
blockRef?: React.RefObject<HTMLDivElement>;
|
||||
}
|
||||
|
||||
export interface BlockFrameProps {
|
||||
blockModel?: BlockComponentModel;
|
||||
blockModel?: BlockComponentModel2;
|
||||
nodeModel?: NodeModel;
|
||||
viewModel?: ViewModel;
|
||||
preview: boolean;
|
||||
|
Loading…
Reference in New Issue
Block a user