Doing something

src/screens/common/components/SelectSupplier.js

@@ -0,0 +1,47 @@
+import SelectField from 'material-ui/SelectField';
+import MenuItem from 'material-ui/MenuItem';
+import React from 'react';
+
+export const SelectSupplier = ({
+  suppliers,
+  selectSupplier,
+  selectedSupplierId
+}) => {
+  console.log(suppliers, selectSupplier, selectedSupplierId);
+
+  return (
+    <SelectField
+      id="select-supplier"
+      floatingLabelFixed={true}
+      style={{ minWidth: 350 }}
+      floatingLabelText={'Provider'}
+      onChange={(e, k, v) => selectSupplier(v)}
+      autoWidth={true}
+      value={Number(selectedSupplierId) || -1}
+      iconStyle={{ fill: 'rgba(22, 82, 149, 0.69)' }}
+    >
+      {suppliers.map(supplier => {
+        const isLevel1Provider =
+          (supplier.chouetteInfo &&
+            supplier.chouetteInfo.migrateDataToProvider) ||
+          supplier.id === -1;
+        return (
+          <MenuItem
+            key={supplier.id}
+            value={supplier.id}
+            label={supplier.name}
+            primaryText={
+              <span
+                style={{
+                  color: isLevel1Provider ? 'intial' : '#d9a51b'
+                }}
+              >
+                {supplier.name}
+              </span>
+            }
+          />
+        );
+      })}
+    </SelectField>
+  );
+};

src/screens/geocoder/components/tariffZonesImport/TariffZonesImport.js

@@ -0,0 +1,17 @@
+import { SelectSupplier } from '../../../common/components/SelectSupplier';
+import { useSelector } from 'react-redux';
+import { useState } from 'react';
+
+export const TariffZonesImport = () => {
+  const suppliers = useSelector(state => state.SuppliersReducer.data, []);
+  const [selectedSupplier, setSelectedSupplier] = useState();
+
+  return null;
+  {
+    /*
+  <SelectSupplier
+
+  />;
+*/
+  }
+};

src/screens/geocoder/index.js

@@ -47,13 +47,17 @@ export default () => {
       >
         <Tab label="Geocoder pipeline" {...a11yProps(0)} />
         <Tab label="OSM POI filter" {...a11yProps(1)} />
+        <Tab label="TariffZone/FareZone Import" {...a11yProps(2)} />
       </Tabs>
       <TabPanel value={value} index={0}>
         <Pelias />
       </TabPanel>
       <TabPanel value={value} index={1}>
         <OSMPOIFilter />
       </TabPanel>
+      <TabPanel value={value} index={2}>
+        <OSMPOIFilter />
+      </TabPanel>
     </div>
   );
 };

src/screens/providers/components/SuppliersContainer.js

@@ -26,6 +26,7 @@ import rolesParser from 'roles/rolesParser';
 import MdEdit from 'material-ui/svg-icons/image/edit';
 import MdDelete from 'material-ui/svg-icons/action/delete-forever';
 import ConfirmDialog from 'modals/ConfirmDialog';
+import { SelectSupplier } from '../../common/components/SelectSupplier';
 
 class SuppliersContainer extends React.Component {
   constructor(props) {
@@ -121,39 +122,11 @@ class SuppliersContainer extends React.Component {
           }}
         >
           <div style={{ display: 'flex', alignItems: 'center' }}>
-            <SelectField
-              id="select-supplier"
-              floatingLabelFixed={true}
-              style={{ minWidth: 350 }}
-              floatingLabelText={'Provider'}
-              onChange={(e, k, v) => this.selectSupplier(v)}
-              autoWidth={true}
-              value={Number(activeProviderId) || -1}
-              iconStyle={{ fill: 'rgba(22, 82, 149, 0.69)' }}
-            >
-              {supplierItems.map(supplier => {
-                const isLevel1Provider =
-                  (supplier.chouetteInfo &&
-                    supplier.chouetteInfo.migrateDataToProvider) ||
-                  supplier.id === -1;
-                return (
-                  <MenuItem
-                    key={supplier.id}
-                    value={supplier.id}
-                    label={supplier.name}
-                    primaryText={
-                      <span
-                        style={{
-                          color: isLevel1Provider ? 'intial' : '#d9a51b'
-                        }}
-                      >
-                        {supplier.name}
-                      </span>
-                    }
-                  />
-                );
-              })}
-            </SelectField>
+            <SelectSupplier
+              suppliers={supplierItems}
+              selectSupplier={v => this.selectSupplier(v)}
+              selectedSupplierId={activeProviderId}
+            />
             {canEditOrganisation && (
               <div
                 style={{