update copy as react logic

src/components/modules/IconsHome/IconCardsSection/EmptyPlaceholder.tsx

@@ -23,7 +23,7 @@ export const EmptyPlaceholder: FC<{
           </svg>
         </div>
         <div className="text-white w-1/2 text-center">
-          There are no icons in collection for “{searchQuery}”.
+          No icons in collection for “{searchQuery}”.
         </div>
       </div>
     );

src/components/modules/IconsHome/LeftIconsCollectionsNav/ListItem/OptionsOverlay.tsx

@@ -5,6 +5,7 @@ import { ipcRenderer } from 'electron';
 import { ReactComponent as ExternalLinkIcon } from 'assets/icons/external-link-16.svg';
 import { Dropdown } from 'components/ui/atomic-components';
 import { ReactComponent as PencilIcon } from 'assets/icons/pencil.svg';
+import { ReactComponent as CursorClickIcon } from 'assets/icons/cursor-click-sm.svg';
 
 export const OptionsOverlay: FC<{
   collection?: Collection;
@@ -25,6 +26,12 @@ export const OptionsOverlay: FC<{
         <ExternalLinkIcon className="mr-2" />
         <div>Open in finder</div>
       </Dropdown.Item>
+
+      {/* <Dropdown.Item onClick={openCollectionFolderInFinder}>
+        <CursorClickIcon className="mr-2" />
+        <div>Customize actions</div>
+      </Dropdown.Item> */}
+
       <Dropdown.Item onClick={onDeleteClick}>
         <TrashIcon className="mr-2" />
         <div>Delete</div>

src/components/modules/IconsHome/RightIconDetailsSection/index.tsx

@@ -3,9 +3,10 @@ import { Button } from 'components/ui/atomic-components';
 import { ReactComponent as CopyIcon } from 'assets/icons/clipboard-copy.svg';
 import { Icon } from 'data/icons';
 import SVG from 'react-inlinesvg';
-import { camelCase } from 'lodash';
+import { camelCase, capitalize } from 'lodash';
 import { formatBytes } from 'utils/formatBytes';
 import { formatDate } from 'utils/formatDate';
+import { CollectionsApi } from 'data/collections';
 
 interface Props {
   selectedIcon: Icon | null;
@@ -16,11 +17,16 @@ export const RightIconDetailsSection: FC<Props> = ({ selectedIcon }) => {
 
   const [svgDimensions, setSvgDimensions] = useState('-');
 
-  const onCopyClick = () => {
+  const onCopyClick = async () => {
     if (selectedIcon) {
-      const copyText = `import { ReactComponent as ${camelCase(
-        selectedIcon.name
-      )}Icon } from '${selectedIcon.imageSrc}';`;
+      const collection = await CollectionsApi.find(selectedIcon.collectionId);
+
+      const collectionLoc = collection?.folderSrc || '';
+      const relativeIconPath = selectedIcon.imageSrc.replace(collectionLoc, '');
+
+      const copyText = `import { ReactComponent as ${capitalize(
+        camelCase(selectedIcon.name.replace(/^ic_/, ''))
+      )}Icon } from 'assets${relativeIconPath}';`;
 
       navigator.clipboard.writeText(copyText);
     }

src/components/modules/IconsHome/SearchAddTopSection/index.tsx

@@ -11,7 +11,7 @@ interface Props {
 }
 
 const keyMap = {
-  FOCUS_ICON_SEARCH: ['cmd+k', 'ctrl+k'],
+  FOCUS_ICON_SEARCH: ['cmd+f', 'ctrl+f'],
 };
 
 export const SearchAddTopSection: FC<Props> = ({
@@ -32,7 +32,7 @@ export const SearchAddTopSection: FC<Props> = ({
       <GlobalHotKeys keyMap={keyMap} handlers={handlers} />
       <Search
         name="icons-search"
-        placeholder="Quick search for icons (⌘k)"
+        placeholder="Quick search for icons (⌘f)"
         className="flex-1"
         value={searchQuery || ''}
         onChange={(e) => setSearchQuery(e.target.value)}