closes #229 same arrow for react-select dropdown

components/common/MySelect.tsx

@@ -1,6 +1,8 @@
+import { ChevronDownIcon } from "@chakra-ui/icons";
 import { useMyTheme } from "lib/useMyTheme";
 import { useState } from "react";
 import ReactSelect, {
+  components,
   GroupedOptionsType,
   OptionsType,
   OptionTypeBase,
@@ -34,6 +36,15 @@ interface SelectProps {
   hideMenuBeforeTyping?: boolean;
 }
 
+const DropdownIndicator = (props: any) => {
+  const { textColor } = useMyTheme();
+  return (
+    <components.DropdownIndicator {...props}>
+      <ChevronDownIcon fontSize="1.3rem" color={textColor} />
+    </components.DropdownIndicator>
+  );
+};
+
 const MySelect: React.FC<SelectProps> = ({
   options,
   components,
@@ -103,6 +114,7 @@ const MySelect: React.FC<SelectProps> = ({
             }
           : {
               IndicatorSeparator: () => null,
+              DropdownIndicator,
               ...components,
             }
       }

package-lock.json

@@ -783,6 +783,15 @@
         "@chakra-ui/utils": "1.0.2"
       }
     },
+    "@chakra-ui/icons": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@chakra-ui/icons/-/icons-1.0.2.tgz",
+      "integrity": "sha512-6gPoIi8KHZI8kiWQBlOuxcZOJv6xouYI4sLX23WP2QZdTsplF9qCyZMXhbg8MHTk0YYdb0i2m/t6Y+9OcDjohA==",
+      "requires": {
+        "@chakra-ui/icon": "1.0.2",
+        "@types/react": "17.0.0"
+      }
+    },
     "@chakra-ui/image": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/@chakra-ui/image/-/image-1.0.2.tgz",
@@ -2010,14 +2019,12 @@
     "@types/prop-types": {
       "version": "15.7.3",
       "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz",
-      "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==",
-      "dev": true
+      "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw=="
     },
     "@types/react": {
       "version": "17.0.0",
       "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.0.tgz",
       "integrity": "sha512-aj/L7RIMsRlWML3YB6KZiXB3fV2t41+5RBGYF8z+tAKU43Px8C3cYUZsDvf1/+Bm4FK21QWBrDutu8ZJ/70qOw==",
-      "dev": true,
       "requires": {
         "@types/prop-types": "*",
         "csstype": "^3.0.2"

package.json

@@ -22,6 +22,7 @@
     "compile": "lingui compile"
   },
   "dependencies": {
+    "@chakra-ui/icons": "^1.0.2",
     "@chakra-ui/react": "^1.0.4",
     "@chakra-ui/theme-tools": "^1.0.2",
     "@emotion/react": "^11.1.2",