mirror of
https://github.com/gravitational/teleport.git
synced 2026-11-02 23:31:08 +08:00
Rafał Cieślak
1de2ae6b61
* Move openReport to VNet context * Add useStateRef for creating refs that mirror state * Extract hasReportFoundIssues * Create notification when running periodic diag checks * Show a warning icon next to VNet connection item * Show warning indicator next to connections icon * Add JSDoc for DiagnosticsAlert * ConnectionStatusIndicator: Fix error indicator on Windows * Extract makeReportWithIssuesFound * Add missing ConnectionsContextProvider * useStateRef: Remove `as const`
71 lines
2.0 KiB
TypeScript
71 lines
2.0 KiB
TypeScript
/**
|
|
* Teleport
|
|
* Copyright (C) 2025 Gravitational, Inc.
|
|
*
|
|
* This program is free software: you can redistribute it and/or modify
|
|
* it under the terms of the GNU Affero General Public License as published by
|
|
* the Free Software Foundation, either version 3 of the License, or
|
|
* (at your option) any later version.
|
|
*
|
|
* This program is distributed in the hope that it will be useful,
|
|
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
* GNU Affero General Public License for more details.
|
|
*
|
|
* You should have received a copy of the GNU Affero General Public License
|
|
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
*/
|
|
|
|
import {
|
|
Dispatch,
|
|
RefObject,
|
|
SetStateAction,
|
|
useCallback,
|
|
useRef,
|
|
useState,
|
|
} from 'react';
|
|
|
|
/**
|
|
* useStateRef creates a piece of state and a ref reflecting a value of the state and a setter that
|
|
* updates both the state and the ref. Useful is situations where an event handler needs to read the
|
|
* value of the state without making its identity dependent on the value of the state.
|
|
*
|
|
* @example
|
|
*
|
|
* const [isOpen, isOpenRef, setIsOpen] = useStateRef(false)
|
|
*
|
|
* const sendNotification = useCallback(() => {
|
|
* if (isOpenRef.current) {
|
|
* return;
|
|
* }
|
|
*
|
|
* client.sendNotification(foo);
|
|
* }, [client, foo]);
|
|
*
|
|
* useEffect(() => {
|
|
* setInterval(sendNotification, 5000);
|
|
*
|
|
* return () => {
|
|
* // cleanup
|
|
* }
|
|
* }, [sendNotification])
|
|
*/
|
|
export function useStateRef<T>(
|
|
initialState: T
|
|
): [T, RefObject<T>, Dispatch<SetStateAction<T>>] {
|
|
const stateRef = useRef(initialState);
|
|
const [state, setState] = useState(initialState);
|
|
|
|
const setStateAndRef = useCallback((newState: SetStateAction<T>) => {
|
|
setState(newState);
|
|
|
|
if (typeof newState === 'function') {
|
|
stateRef.current = (newState as (prevState: T) => T)(stateRef.current);
|
|
} else {
|
|
stateRef.current = newState;
|
|
}
|
|
}, []);
|
|
|
|
return [state, stateRef, setStateAndRef];
|
|
}
|