calculatorEstateSolution/src/components/DraggableGallery/DraggableGallery.js

import "./DraggableGallery.css";
import { Gallery } from "./components/Gallery/Gallery";
import { ScrollContainer } from "react-indiana-drag-scroll";
import "react-indiana-drag-scroll/dist/style.css";

export const DraggableGallery = () => {
  const arrayLegend = ["Тип", "Площадь", "Стоимость", "Этаж", "Cрок Сдачи"];

  return (
    <div className="legend-layout">
      <div className="legend-container">
        <p className="legend-caption">Избранное</p>
        <div className="legend">
          {arrayLegend.map((i, index) => (
            <div className="legend-item" key={index}>
              <div className="legend-name"> {i}</div>
            </div>
          ))}
        </div>
      </div>
      <ScrollContainer
        hideScrollbars={false}
        mouseScroll={{ ignoreElements: ".card-button-container" }}
        className="gallery"
      >
        <Gallery></Gallery>
      </ScrollContainer>
    </div>
  );
};