feat(kuberenetes): add annotations to kube objects EE-4089 (#8499)

* add annotations BE teaser
* fix settings icon click on home screen for kube env
* add debouce to namespace validation
* ingress button tooltip fixed
* fix tooltip text

app/react/kubernetes/annotations/AnnotationsBeTeaser.tsx

@@ -0,0 +1,51 @@
+import { Plus } from 'lucide-react';
+
+import { FeatureId } from '@/react/portainer/feature-flags/enums';
+
+import { BETeaserButton } from '@@/BETeaserButton';
+import { Tooltip } from '@@/Tip/Tooltip';
+
+export function AnnotationsBeTeaser() {
+  return (
+    <div className="col-sm-12 text-muted mb-2 block px-0">
+      <div className="control-label !mb-2 text-left font-medium">
+        Annotations
+        <Tooltip
+          message={
+            <div className="vertical-center">
+              <span>
+                You can specify{' '}
+                <a
+                  href="https://kubernetes.io/docs/concepts/overview/working-with-objects/annotations/"
+                  target="_black"
+                >
+                  annotations
+                </a>{' '}
+                for the object. See further Kubernetes documentation on{' '}
+                <a
+                  href="https://kubernetes.io/docs/reference/labels-annotations-taints/"
+                  target="_black"
+                >
+                  well-known annotations
+                </a>
+                .
+              </span>
+            </div>
+          }
+          setHtmlMessage
+        />
+      </div>
+      <div className="block">
+        <BETeaserButton
+          className="!p-0"
+          heading="Add annotation"
+          buttonText="Add annotation"
+          message="Allows specifying of annotations on this resource."
+          featureId={FeatureId.K8S_ANNOTATIONS}
+          buttonClassName="!ml-0"
+          icon={Plus}
+        />
+      </div>
+    </div>
+  );
+}