import type React from 'react';

export const InsightSvg: React.FC = (): JSX.Element => (
	<svg fill="none" height="18" viewBox="0 0 20 18" width="20" xmlns="http://www.w3.org/2000/svg">
		<path
			d="M2.5 14.7857C2.5 15.1393 2.77969 15.4286 3.125 15.4286H18.75C19.4414 15.4286 20 16.0031 20 16.7143C20 17.4254 19.4414 18 18.75 18H3.125C1.39922 18 0 16.5616 0 14.7857V1.28571C0 0.575759 0.559766 0 1.25 0C1.94023 0 2.5 0.575759 2.5 1.28571V14.7857ZM13.3828 9.90804C12.8945 10.4103 12.1055 10.4103 11.6172 9.90804L9.375 7.6058L5.88281 11.1938C5.39453 11.696 4.60547 11.696 4.11719 11.1938C3.62813 10.6915 3.62813 9.87991 4.11719 9.37768L8.49219 4.87768C8.98047 4.37545 9.76953 4.37545 10.2578 4.87768L12.5 7.17991L16.6172 2.94911C17.1055 2.44607 17.8945 2.44607 18.3828 2.94911C18.8711 3.45134 18.8711 4.26295 18.3828 4.76518L13.3828 9.90804Z"
			fill="#5F5F5F"
		/>
		<path
			d="M2.5 14.7857C2.5 15.1393 2.77969 15.4286 3.125 15.4286H18.75C19.4414 15.4286 20 16.0031 20 16.7143C20 17.4254 19.4414 18 18.75 18H3.125C1.39922 18 0 16.5616 0 14.7857V1.28571C0 0.575759 0.559766 0 1.25 0C1.94023 0 2.5 0.575759 2.5 1.28571V14.7857ZM13.3828 9.90804C12.8945 10.4103 12.1055 10.4103 11.6172 9.90804L9.375 7.6058L5.88281 11.1938C5.39453 11.696 4.60547 11.696 4.11719 11.1938C3.62812 10.6915 3.62812 9.87991 4.11719 9.37768L8.49219 4.87768C8.98047 4.37545 9.76953 4.37545 10.2578 4.87768L12.5 7.17991L16.6172 2.94911C17.1055 2.44607 17.8945 2.44607 18.3828 2.94911C18.8711 3.45134 18.8711 4.26295 18.3828 4.76518L13.3828 9.90804Z"
			fill="var(--primary-color)"
		/>
	</svg>
);

export const DatabaseSvg: React.FC = (): JSX.Element => (
	<svg fill="none" height="20" viewBox="0 0 21 20" width="21" xmlns="http://www.w3.org/2000/svg">
		<path
			d="M11.6953 18.0387H20.4652V19.5004H11.6953V18.0387ZM11.6953 14.3846H20.4652V15.8462H11.6953V14.3846ZM11.6953 10.7305H20.4652V12.1921H11.6953V10.7305Z"
			fill="#5F5F5F"
		/>
		<path
			d="M8.77312 17.3072H5.48441C4.11437 17.3088 2.79349 16.7969 1.78224 15.8726C0.770994 14.9483 0.142791 13.6786 0.0215164 12.3139C-0.099758 10.9493 0.2947 9.58868 1.1271 8.50052C1.9595 7.41235 3.16942 6.67558 4.51826 6.43549C4.85989 4.64911 5.85534 3.0543 7.31009 1.9627C8.76483 0.871102 10.5743 0.361162 12.385 0.532528C14.1957 0.703894 15.8774 1.54425 17.1015 2.88938C18.3256 4.23452 19.0042 5.98776 19.0047 7.80652H17.543C17.5421 6.31184 16.9687 4.8743 15.9406 3.78933C14.9126 2.70435 13.508 2.05437 12.0155 1.97297C10.5231 1.89156 9.05613 2.38491 7.91618 3.35163C6.77622 4.31835 6.04986 5.685 5.88636 7.1707L5.82059 7.78021L5.20889 7.82113C4.16795 7.88998 3.19463 8.36112 2.4949 9.13486C1.79517 9.90859 1.42392 10.9242 1.45972 11.9668C1.49552 13.0094 1.93555 13.9972 2.6867 14.7211C3.43786 15.445 4.4412 15.8483 5.48441 15.8456H8.77312V17.3072Z"
			fill="#5F5F5F"
		/>
	</svg>
);

export const ToolsSvg: React.FC = (): JSX.Element => (
	<svg fill="none" height="22" viewBox="0 0 20 22" width="20" xmlns="http://www.w3.org/2000/svg">
		<path
			d="M9.23077 2.92308H19.2308V4.53846H9.23077V2.92308ZM9.23077 17.4615H19.2308V19.0769H9.23077V17.4615ZM0.769232 10.1923H10.7692V11.8077H0.769232V10.1923ZM3.07692 6.96154C2.46837 6.96154 1.87347 6.77206 1.36748 6.41706C0.86148 6.06206 0.467103 5.55748 0.234218 4.96713C0.00133317 4.37679 -0.0596002 3.72719 0.0591236 3.10048C0.177847 2.47377 0.470896 1.8981 0.901211 1.44627C1.33153 0.99444 1.87978 0.68674 2.47665 0.56208C3.07351 0.43742 3.69218 0.5014 4.25441 0.745929C4.81665 0.990458 5.2972 1.40455 5.63529 1.93585C5.97339 2.46715 6.15385 3.09178 6.15385 3.73077C6.15385 4.58762 5.82967 5.40938 5.25264 6.01527C4.6756 6.62116 3.89298 6.96154 3.07692 6.96154ZM3.07692 2.11539C2.77265 2.11539 2.4752 2.21013 2.2222 2.38763C1.9692 2.56513 1.77201 2.81742 1.65557 3.11259C1.53913 3.40776 1.50866 3.73256 1.56802 4.04592C1.62739 4.35927 1.77391 4.6471 1.98907 4.87302C2.20423 5.09894 2.47835 5.25279 2.77679 5.31512C3.07522 5.37745 3.38455 5.34546 3.66567 5.22319C3.94679 5.10093 4.18706 4.89388 4.35611 4.62823C4.52516 4.36258 4.61539 4.05026 4.61539 3.73077C4.61539 3.30234 4.4533 2.89146 4.16478 2.58852C3.87626 2.28558 3.48495 2.11539 3.07692 2.11539ZM3.07692 21.5C2.46837 21.5 1.87347 21.3105 1.36748 20.9555C0.86148 20.6005 0.467103 20.0959 0.234218 19.5056C0.00133317 18.9152 -0.0596002 18.2656 0.0591236 17.6389C0.177847 17.0122 0.470896 16.4366 0.901211 15.9847C1.33153 15.5329 1.87978 15.2252 2.47665 15.1005C3.07351 14.9759 3.69218 15.0399 4.25441 15.2844C4.81665 15.5289 5.2972 15.943 5.63529 16.4743C5.97339 17.0056 6.15385 17.6302 6.15385 18.2692C6.15385 19.1261 5.82967 19.9478 5.25264 20.5537C4.6756 21.1596 3.89298 21.5 3.07692 21.5ZM3.07692 16.6538C2.77265 16.6538 2.4752 16.7486 2.2222 16.9261C1.9692 17.1036 1.77201 17.3559 1.65557 17.651C1.53913 17.9462 1.50866 18.271 1.56802 18.5844C1.62739 18.8977 1.77391 19.1856 1.98907 19.4115C2.20423 19.6374 2.47835 19.7912 2.77679 19.8536C3.07522 19.9159 3.38455 19.8839 3.66567 19.7617C3.94679 19.6394 4.18706 19.4323 4.35611 19.1667C4.52516 18.901 4.61539 18.5887 4.61539 18.2692C4.61539 17.8408 4.4533 17.4299 4.16478 17.127C3.87626 16.824 3.48495 16.6538 3.07692 16.6538ZM16.9231 14.2308C16.3145 14.2308 15.7196 14.0413 15.2136 13.6863C14.7076 13.3313 14.3133 12.8267 14.0804 12.2364C13.8475 11.646 13.7866 10.9964 13.9053 10.3697C14.024 9.743 14.317 9.16733 14.7474 8.7155C15.1777 8.26367 15.7259 7.95597 16.3228 7.83131C16.9197 7.70665 17.5383 7.77063 18.1006 8.01516C18.6628 8.25969 19.1433 8.67378 19.4814 9.20508C19.8195 9.73638 20 10.361 20 11C20 11.8569 19.6758 12.6786 19.0988 13.2845C18.5218 13.8904 17.7391 14.2308 16.9231 14.2308ZM16.9231 9.38462C16.6188 9.38462 16.3214 9.47936 16.0684 9.65686C15.8154 9.83436 15.6182 10.0866 15.5017 10.3818C15.3853 10.677 15.3548 11.0018 15.4142 11.3151C15.4735 11.6285 15.6201 11.9163 15.8352 12.1422C16.0504 12.3682 16.3245 12.522 16.6229 12.5843C16.9214 12.6467 17.2307 12.6147 17.5118 12.4924C17.7929 12.3702 18.0332 12.1631 18.2023 11.8975C18.3713 11.6318 18.4615 11.3195 18.4615 11C18.4615 10.5716 18.2995 10.1607 18.0109 9.85775C17.7224 9.55481 17.3311 9.38462 16.9231 9.38462Z"
			fill="#5F5F5F"
		/>
	</svg>
);

export const AboutSvg: React.FC = (): JSX.Element => (
	<svg fill="none" height="35" viewBox="0 0 35 35" width="35" xmlns="http://www.w3.org/2000/svg">
		<circle cx="17.5" cy="17.5" fill="var(--primary-color)" r="17.5" />
		<path
			d="M10.2001 16.087V26H23.8001V16.087H10.2001ZM7.00007 16.087L17.0001 7L27.0001 16.087"
			stroke="white"
			strokeLinecap="round"
			strokeLinejoin="round"
			strokeWidth="1.5"
		/>
	</svg>
);

export interface Props {
	// isOpenChanged?: (isOpen: boolean) => void;
	isOpen: boolean;
	isOpenChanged: () => void;
}
