@craftercms/studio-ui/components/DependenciesDialog/DependenciesList.js

Services, components, models & utils to build CrafterCMS authoring extensions.

/*
 * Copyright (C) 2007-2022 Crafter Software Corporation. All Rights Reserved.
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Lesser General Public License version 3 as published by
 * the Free Software Foundation.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU Lesser General Public License for more details.
 *
 * You should have received a copy of the GNU Lesser General Public License
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */

/*
 * Copyright (C) 2007-2022 Crafter Software Corporation. All Rights Reserved.
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License version 3 as published by
 * the Free Software Foundation.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
import List from '@mui/material/List';
import ListItem from '@mui/material/ListItem';
import { isImage } from '../../utils/content';
import ListItemAvatar from '@mui/material/ListItemAvatar';
import Avatar from '@mui/material/Avatar';
import ListItemText from '@mui/material/ListItemText';
import IconButton from '@mui/material/IconButton';
import MoreVertIcon from '@mui/icons-material/MoreVertRounded';
import React from 'react';
import { dependenciesDialogStyles } from './DependenciesDialog';
import { assetsTypes } from './utils';
export function DependenciesList(props) {
  const { dependencies, compactView, showTypes, handleContextMenuClick } = props;
  const { classes, cx } = dependenciesDialogStyles();
  return React.createElement(
    List,
    { className: classes.dependenciesList },
    dependencies === null || dependencies === void 0
      ? void 0
      : dependencies
          .filter((dependency) => assetsTypes[showTypes].filter(dependency))
          .map((dependency, i) =>
            React.createElement(
              ListItem,
              {
                key: dependency.path,
                divider: dependencies.length - 1 !== i,
                className: cx(classes.dependenciesListItem, {
                  [classes.dependenciesCompactListItem]: compactView
                })
              },
              isImage(dependency.path) &&
                !compactView &&
                React.createElement(
                  ListItemAvatar,
                  null,
                  React.createElement(Avatar, { className: classes.listItemPreview, src: dependency.path })
                ),
              React.createElement(ListItemText, {
                className: classes.listItemContent,
                primary: dependency.label,
                secondary: !compactView ? dependency.path : null
              }),
              !dependency.path.startsWith('/config/studio/content-types') &&
                React.createElement(
                  IconButton,
                  {
                    'aria-haspopup': 'true',
                    onClick: (e) => {
                      handleContextMenuClick(e, dependency);
                    },
                    className: classes.listEllipsis,
                    size: 'large'
                  },
                  React.createElement(MoreVertIcon, null)
                )
            )
          )
  );
}
export default DependenciesList;