import { Skeleton } from '@scaleflex/ui/core';
import Styled from '../AssetsList.styled';
import StyledGridView from './GridView.styled';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var GridLayoutFoldersSkeleton = function GridLayoutFoldersSkeleton(_ref) {
  var hidePreviewSkeleton = _ref.hidePreviewSkeleton;
  return /*#__PURE__*/_jsx(Styled.Accordion, {
    expanded: true,
    label: /*#__PURE__*/_jsx(Skeleton, {
      width: 200
    }),
    style: {
      marginTop: '12px'
    },
    detailStyle: {
      margin: '0px'
    },
    hideIcon: true,
    onContextMenu: function onContextMenu(e) {
      return e.stopPropagation();
    },
    children: /*#__PURE__*/_jsx("div", {
      className: "filerobot-Provider-ItemCategory-wrapper",
      children: /*#__PURE__*/_jsx(StyledGridView.SkeletonContainer, {
        children: Array(18).fill().map(function (_, index) {
          return /*#__PURE__*/_jsxs(Styled.FolderSectionItem, {
            className: "item-folder",
            children: [/*#__PURE__*/_jsx(Styled.FolderIcon, {}), /*#__PURE__*/_jsxs(Styled.FolderContent, {
              role: "button",
              $loading: true,
              children: [!hidePreviewSkeleton && /*#__PURE__*/_jsxs(Styled.FolderPreviewGrid, {
                children: [/*#__PURE__*/_jsx(Styled.PreviewGridLeftColumn, {
                  children: /*#__PURE__*/_jsx(Skeleton, {
                    height: "100%",
                    width: "100%"
                  })
                }), /*#__PURE__*/_jsxs(Styled.PreviewGridRightColumn, {
                  children: [/*#__PURE__*/_jsx(Styled.PreviewGridImgWrapper, {
                    children: /*#__PURE__*/_jsx(Skeleton, {
                      height: "100%",
                      width: "100%"
                    })
                  }), /*#__PURE__*/_jsx(Styled.PreviewGridImgWrapper, {
                    children: /*#__PURE__*/_jsx(Skeleton, {
                      height: "100%",
                      width: "100%"
                    })
                  })]
                })]
              }), /*#__PURE__*/_jsxs(Styled.FolderInfo, {
                children: [/*#__PURE__*/_jsx(Styled.FolderTitle, {
                  children: /*#__PURE__*/_jsx(Skeleton, {
                    width: 150
                  })
                }), /*#__PURE__*/_jsxs(Styled.FolderSubTitle, {
                  size: "sm",
                  children: [/*#__PURE__*/_jsx(Styled.FolderSubTitleText, {
                    size: "sm",
                    children: /*#__PURE__*/_jsx(Skeleton, {
                      width: 66
                    })
                  }), /*#__PURE__*/_jsx(Styled.FolderSubTitleText, {
                    size: "sm",
                    children: /*#__PURE__*/_jsx(Skeleton, {
                      width: 66
                    })
                  })]
                })]
              })]
            })]
          }, index);
        })
      })
    })
  });
};
export default GridLayoutFoldersSkeleton;