Initial commit

src/components/Icons/tables/Circle4PeopleIcon.tsx

@@ -0,0 +1,85 @@
+interface Circle4PeopleIconType {
+  className?: string;
+  onClick?: () => void;
+  title?: string;
+  timer?: string;
+  fill?: string;
+}
+
+const Circle4PeopleIcon = ({
+  className,
+  onClick,
+  title,
+  timer,
+  fill = "#5F6C7B",
+}: Circle4PeopleIconType) => {
+  return (
+    <svg
+      width="75"
+      height="75"
+      viewBox="0 0 75 75"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      onClick={onClick}
+    >
+      <path
+        d="M70.9565 24.8184C73.1894 24.8184 74.9995 26.6285 74.9995 28.8614V45.0331C74.9995 47.266 73.1894 49.0761 70.9565 49.0761V24.8184Z"
+        fill={fill}
+        fillOpacity="0.12"
+      />
+      <path
+        d="M25.999 4.11816C25.999 1.8853 27.8091 0.0752001 30.042 0.0752001L46.2141 0.0752001C48.4469 0.0752001 50.257 1.8853 50.257 4.11816L25.999 4.11816Z"
+        fill={fill}
+        fillOpacity="0.12"
+      />
+      <path
+        d="M50.2559 70.2617C50.2559 72.4946 48.4458 74.3047 46.2129 74.3047H30.0408C27.808 74.3047 25.9979 72.4946 25.9979 70.2617H50.2559Z"
+        fill={fill}
+        fillOpacity="0.12"
+      />
+      <path
+        d="M4.81201 49.0752C2.57912 49.0752 0.769012 47.2651 0.769012 45.0322L0.769012 28.8604C0.769012 26.6275 2.57912 24.8174 4.81201 24.8174L4.81201 49.0752Z"
+        fill={fill}
+        fillOpacity="0.12"
+      />
+      <ellipse
+        cx="37.8909"
+        cy="37.2011"
+        rx="30.3225"
+        ry="30.3222"
+        fill={fill}
+        fillOpacity="0.12"
+      />
+
+      {/* Title and Timer Text */}
+      {title && (
+        <text
+          x="37.5"
+          y="35"
+          textAnchor="middle"
+          fontSize="12"
+          fontWeight="bold"
+          fill="#5F6C7B"
+          fontFamily="Arial, sans-serif"
+        >
+          {title}
+        </text>
+      )}
+      {timer && (
+        <text
+          x="37.5"
+          y="55"
+          textAnchor="middle"
+          fontSize="10"
+          fill="#5F6C7B"
+          fontFamily="Arial, sans-serif"
+        >
+          {timer}
+        </text>
+      )}
+    </svg>
+  );
+};
+
+export default Circle4PeopleIcon;