reoragnise collection share select components

src/components/Collections/CollectionShare/publicShare/customSelectComponents.tsx

@@ -1,19 +0,0 @@
-import React from 'react';
-import { Box, Typography, Divider } from '@mui/material';
-import { components } from 'react-select';
-
-const { Option } = components;
-
-export const OptionWithDivider = (props) => (
-    <Option {...props}>
-        <LabelWithDivider data={props.data} />
-    </Option>
-);
-export const LabelWithDivider = ({ data }) => (
-    <>
-        <Box className="main" px={3} py={1}>
-            <Typography>{data.label}</Typography>
-        </Box>
-        <Divider />
-    </>
-);

src/components/Collections/CollectionShare/publicShare/manage/deviceLimit.tsx

@@ -4,7 +4,8 @@ import Select from 'react-select';
 import { DropdownStyle } from 'styles/dropdown';
 import { getDeviceLimitOptions } from 'utils/collection';
 import constants from 'utils/strings/constants';
-import { OptionWithDivider } from '../customSelectComponents';
+import { OptionWithDivider } from './selectComponents/OptionWithDivider';
+
 export function ManageDeviceLimit({
     publicShareProp,
     collection,

src/components/Collections/CollectionShare/publicShare/manage/linkExpiry.tsx

@@ -5,7 +5,7 @@ import { linkExpiryStyle } from 'styles/linkExpiry';
 import { shareExpiryOptions } from 'utils/collection';
 import constants from 'utils/strings/constants';
 import { dateStringWithMMH } from 'utils/time';
-import { OptionWithDivider } from '../customSelectComponents';
+import { OptionWithDivider } from './selectComponents/OptionWithDivider';
 
 export function ManageLinkExpiry({
     publicShareProp,

src/components/Collections/CollectionShare/publicShare/manage/selectComponents/LabelWithDivider.tsx

@@ -0,0 +1,13 @@
+import React from 'react';
+import { Box, Typography, Divider } from '@mui/material';
+
+export function LabelWithDivider({ data }) {
+    return (
+        <>
+            <Box className="main" px={3} py={1}>
+                <Typography>{data.label}</Typography>
+            </Box>
+            <Divider />
+        </>
+    );
+}

src/components/Collections/CollectionShare/publicShare/manage/selectComponents/OptionWithDivider.tsx

@@ -0,0 +1,11 @@
+import React from 'react';
+import { LabelWithDivider } from './LabelWithDivider';
+import { components } from 'react-select';
+
+const { Option } = components;
+
+export const OptionWithDivider = (props) => (
+    <Option {...props}>
+        <LabelWithDivider data={props.data} />
+    </Option>
+);