Added announcement disposal:

Added ann details button
Added modal shown on its click
Moved trashbox selection there
Added trashboxes mock while testing in restricted area

front/src/hooks/api/useTrashboxes.ts

@@ -1,18 +1,41 @@
 import { LatLng } from 'leaflet'
+import { sampleSize, random } from 'lodash'
 
-import { useFetch } from '../'
-import { composeTrashboxURL, processTrashbox } from '../../api/trashbox'
-import { isTrashboxResponse } from '../../api/trashbox/types'
+import { Trashbox } from '../../api/trashbox/types'
+import { UseFetchReturn } from '../useFetch'
 
-const useTrashboxes = (position: LatLng) => (
-    useFetch(
-        composeTrashboxURL(position),
-        'GET',
-        true,
-        isTrashboxResponse,
-        processTrashbox,
-        [],
-    )
+import { faker } from '@faker-js/faker/locale/ru'
+import { Category, categories } from '../../assets/category'
+import { useCallback, useMemo } from 'react'
+
+function genMockTrashbox(pos: LatLng): Trashbox {
+    const loc = faker.location.nearbyGPSCoordinate({ origin: [pos.lat, pos.lng], radius: 1 })
+
+    return {
+        Name: faker.company.name(),
+        Address: faker.location.streetAddress(),
+        Categories: faker.lorem.words({ max: 3, min: 1 }).split(' '),
+        Lat: loc[0],
+        Lng: loc[1],
+    }
+}
+
+const useTrashboxes = (position: LatLng, category: Category): UseFetchReturn<Trashbox[]> => (
+    // useFetch(
+    //     composeTrashboxURL(position, category),
+    //     'GET',
+    //     true,
+    //     isTrashboxResponse,
+    //     processTrashbox,
+    //     [],
+    // )
+
+    {
+        data: useMemo(() => new Array(3).fill(3).map(() => genMockTrashbox(position)), [position]),
+        loading: false,
+        error: null,
+        refetch: () => { return },
+    }
 )
 
 export default useTrashboxes