Added tipical student locations

front/src/assets/studentLocations.ts

@@ -0,0 +1,73 @@
+import { iconDormitory, iconITMO, iconLETI } from '../utils/markerIcons'
+
+type LocationType = 'dormitory' | 'leti' | 'itmo'
+
+const studentLocations: {
+    name: string,
+    position: [number, number],
+    type: LocationType
+}[] = [
+        {
+            name: 'Первое, второе, третье общежития',
+            position: [59.987299, 30.330672],
+            type: 'dormitory',
+        },
+        {
+            name: 'Четвертое общежитие',
+            position: [59.985620, 30.331319],
+            type: 'dormitory',
+        },
+        {
+            name: 'Шестое общежитие',
+            position: [59.969713, 30.299851],
+            type: 'dormitory',
+        },
+        {
+            name: 'Седьмое общежитие',
+            position: [60.003723, 30.287616],
+            type: 'dormitory',
+        },
+        {
+            name: 'Восьмое общежитие',
+            position: [59.991115, 30.318752],
+            type: 'dormitory',
+        },
+        {
+            name: 'Общежития Межвузовского студенческого городка',
+            position: [59.871053, 30.307154],
+            type: 'dormitory',
+        },
+        {
+            name: 'Одиннадцатое общежитие',
+            position: [59.877962, 30.242889],
+            type: 'dormitory',
+        },
+        {
+            name: 'Общежитие Академии транспортных технологий',
+            position: [59.870375, 30.308646],
+            type: 'dormitory',
+        },
+        {
+            name: 'ЛЭТИ шестой корпус',
+            position: [59.971578, 30.296653],
+            type: 'leti',
+        },
+        {
+            name: 'ЛЭТИ Первый и другие корпуса',
+            position: [59.971947, 30.324303],
+            type: 'leti',
+        },
+        {
+            name: 'ИТМО',
+            position: [59.956363, 30.310029],
+            type: 'itmo',
+        },
+    ]
+
+const locationsIcons: Record<LocationType, L.Icon> = {
+    dormitory: iconDormitory,
+    itmo: iconITMO,
+    leti: iconLETI,
+}
+
+export { studentLocations, locationsIcons }

front/src/components/AnnouncementDetails.tsx

@@ -11,6 +11,7 @@ import { iconItem } from '../utils/markerIcons'
 import { useId } from '../hooks'
 import SelectDisposalTrashbox from './SelectDisposalTrashbox'
 import StarRating from './StarRating'
+import StudentLocations from './StudentLocations'
 
 const styles = {
     container: {
@@ -52,6 +53,8 @@ const View = ({
                 url='https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'
             />
 
+            <StudentLocations />
+
             <Marker icon={iconItem} position={[lat, lng]}>
                 <Popup>
                     {address}

front/src/components/LocationMarker.tsx

@@ -24,9 +24,10 @@ function LocationMarker({ address, position, setPosition }: LocationMarkerProps)
     })
 
     return (
-        <Marker icon={iconItem} position={position}>
+        <Marker icon={iconItem} position={position} zIndexOffset={1000}>
             <Popup>
                 {address}
+                <br />
                 {position.lat.toFixed(4)}, {position.lng.toFixed(4)}
             </Popup>
         </Marker>

front/src/components/StudentLocations.tsx

@@ -0,0 +1,36 @@
+import { Marker, Tooltip, useMap } from 'react-leaflet'
+import { LatLng } from 'leaflet'
+
+import { locationsIcons, studentLocations } from '../assets/studentLocations'
+
+type StudentLocationsProps = {
+    setPosition?: (pos: LatLng) => void
+}
+
+function StudentLocations({ setPosition }: StudentLocationsProps) {
+    const map = useMap()
+
+    return (
+        <>{
+            studentLocations.map((el) =>
+                <Marker
+                    icon={locationsIcons[el.type]}
+                    position={el.position}
+                    eventHandlers={{
+                        click: setPosition && (() => {
+                            setPosition(new LatLng(...el.position))
+                            map.setView(el.position)
+                        }),
+                    }}
+                >
+                    <Tooltip>
+                        {el.name}
+                    </Tooltip>
+                </Marker>
+            )
+        }
+        </>
+    )
+}
+
+export default StudentLocations

front/src/components/index.ts

@@ -17,3 +17,4 @@ export { default as SelectDisposalTrashbox } from './SelectDisposalTrashbox'
 export { default as StarRating } from './StarRating'
 export { default as CardLayout } from './CardLayout'
 export { default as LocateButton } from './LocateButton'
+export { default as StudentLocations } from './StudentLocations'

front/src/pages/AddPage.tsx

@@ -1,10 +1,10 @@
-import { CSSProperties, FormEventHandler, useEffect, useState } from 'react'
+import { CSSProperties, FormEventHandler, useEffect, useMemo, useState } from 'react'
 import { Form, Button } from 'react-bootstrap'
 import { MapContainer, TileLayer } from 'react-leaflet'
 import { latLng } from 'leaflet'
 import { useNavigate } from 'react-router-dom'
 
-import { MapClickHandler, LocationMarker, CardLayout, LocateButton } from '../components'
+import { MapClickHandler, LocationMarker, CardLayout, LocateButton, StudentLocations } from '../components'
 import { useAddAnnouncement } from '../hooks/api'
 import { categories, categoryNames } from '../assets/category'
 import { stations, lines, lineNames, DEFAULT_LINE } from '../assets/metro'
@@ -38,7 +38,7 @@ function AddPage() {
         formData.append('address', address.data || '') // if address.error
         formData.set('bestBy', new Date((formData.get('bestBy') as number | null) || 0).getTime().toString())
 
-        handleAdd(formData)
+        void handleAdd(formData)
     }
 
     useEffect(() => {
@@ -86,6 +86,8 @@ function AddPage() {
                                 url='https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'
                             />
 
+                            {useMemo(() => <StudentLocations setPosition={setAddressPosition} />, [])}
+
                             <LocationMarker
                                 address={gotResponse(address) ? fallbackError(address) : 'Загрузка...'}
                                 position={addressPosition}

front/src/utils/markerIcons.ts

@@ -2,6 +2,10 @@ import L from 'leaflet'
 
 import itemMarker from '../assets/itemMarker.png'
 import trashMarker from '../assets/trashMarker.png'
+import dormitoryMarker from '../assets/dormitoryMarker.png'
+import letiMarker from '../assets/letiMarker.png'
+import itmoMarker from '../assets/itmoMarker.png'
+
 
 const iconItem = new L.Icon({
     iconUrl: itemMarker,
@@ -17,4 +21,25 @@ const iconTrash = new L.Icon({
     iconSize: [34, 41],
 })
 
-export { iconItem, iconTrash }
+const iconDormitory = new L.Icon({
+    iconUrl: dormitoryMarker,
+    iconRetinaUrl: dormitoryMarker,
+    popupAnchor: [0, 0],
+    iconSize: [41, 41],
+})
+
+const iconLETI = new L.Icon({
+    iconUrl: letiMarker,
+    iconRetinaUrl: letiMarker,
+    popupAnchor: [0, 0],
+    iconSize: [41, 41],
+})
+
+const iconITMO = new L.Icon({
+    iconUrl: itmoMarker,
+    iconRetinaUrl: itmoMarker,
+    popupAnchor: [0, 0],
+    iconSize: [41, 41],
+})
+
+export { iconItem, iconTrash, iconDormitory, iconLETI, iconITMO }