feat: modules page and module editor page for mobiles

src/app/module-editor/[moduleId]/components/mobile/AttributeSelect/AttributeSelect.tsx

@@ -0,0 +1,40 @@
+"use client";
+
+import { FC, useMemo } from "react";
+import useAttributesList from "@/app/module-editor/[moduleId]/hooks/useAttributesList";
+import ObjectSelect, {
+    ObjectSelectProps,
+} from "@/components/selects/ObjectSelect/ObjectSelect";
+import { AttributeSchema } from "@/lib/client";
+
+type Props = Omit<
+    ObjectSelectProps<AttributeSchema | null>,
+    "data" | "getLabelFn" | "getValueFn"
+> & {
+    attributesToExclude?: AttributeSchema[];
+};
+
+const AttributeSelect: FC<Props> = ({ attributesToExclude, ...props }) => {
+    const { attributes } = useAttributesList();
+
+    const availableAttributes = useMemo(() => {
+        const attrIdsToExcludeSet = new Set(
+            attributesToExclude?.map(a => a.id)
+        );
+
+        return attributes.filter(a => !attrIdsToExcludeSet.has(a.id));
+    }, [attributes, attributesToExclude]);
+
+    return (
+        <ObjectSelect
+            searchable
+            placeholder={"Выберите статус"}
+            onClear={() => props.onChange(null)}
+            getLabelFn={(option: AttributeSchema) => option.label}
+            data={availableAttributes}
+            {...props}
+        />
+    );
+};
+
+export default AttributeSelect;