How to hide the label using Tpescript react

Please find the example for the same 

import React, { useState } from 'react';

const MyComponent: React.FC = () => {
  const [hideLabel, setHideLabel] = useState(false);

  const toggleLabelVisibility = () => {
    setHideLabel(!hideLabel);
  };

  return (
    

      Toggle Label
      {!hideLabel && My Label}
    
  );
};

export default MyComponent;

n the example above, we use the useState hook to create a hideLabel state variable and a setHideLabel function to toggle its value. The label is conditionally rendered based on the hideLabel state. If hideLabel is false, the label will be displayed; otherwise, it will be hidden.

Clicking the "Toggle Label" button will call the toggleLabelVisibility function, which will update the hideLabel state, thereby toggling the visibility of the label.

By managing the visibility state with a boolean value and conditionally rendering the label component based on that value, you can effectively hide or show the label dynamically in your React application.