Skip to content
Snippets Groups Projects
Unverified Commit 0a1f9f5c authored by Anton Kulyk's avatar Anton Kulyk Committed by GitHub
Browse files

Remove collection sidebar code (#21400)

parent 82256fe0
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 2 additions and 884 deletions
frontend/src/metabase/collections/components/BulkActions.styled.tsx
+ 2
− 2
View file @ 0a1f9f5c
......@@ -2,12 +2,12 @@ import styled from "@emotion/styled";
import { breakpointMinSmall } from "metabase/styled-components/theme";
import { color } from "metabase/lib/colors";
import { SIDEBAR_WIDTH } from "metabase/collections/constants";
import { NAV_SIDEBAR_WIDTH } from "metabase/nav/constants";
export const FixedBottomBar = styled.div<{ isNavbarOpen: boolean }>`
position: fixed;
bottom: 0;
left: ${props => (props.isNavbarOpen ? SIDEBAR_WIDTH : 0)};
left: ${props => (props.isNavbarOpen ? NAV_SIDEBAR_WIDTH : 0)};
right: 0;
border-top: 1px solid ${color("border")};
background-color: ${color("white")};
......
frontend/src/metabase/collections/components/CollectionSidebar/Bookmarks/Bookmarks.styled.tsx deleted 100644 → 0
+ 0
− 53
View file @ 82256fe0
import styled from "@emotion/styled";
import { css } from "@emotion/react";
import { color } from "metabase/lib/colors";
import { space } from "metabase/styled-components/theme";
import Icon from "metabase/components/Icon";
const CollectionSidebarBookmarksRoot = styled.div`
margin-top: ${space(2)};
margin-bottom: ${space(2)};
`;
interface BookmarkTypeIconProps {
opacity: number;
}
export const BookmarkTypeIcon = styled(Icon)<BookmarkTypeIconProps>`
margin-right: 6px;
opacity: ${({ opacity }) => opacity};
`;
export const BookmarkListRoot = styled.div`
margin: ${space(1)} 0;
`;
export const BookmarkContainer = styled.div`
overflow: hidden;
position: relative;
width: 100%;
&:hover {
background: ${color("bg-medium")};
button {
opacity: 0.5;
}
}
button {
opacity: 0;
color: ${color("brand")};
cursor: pointer;
padding: ${space(1)};
margin-top: 2px;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
`;
export default CollectionSidebarBookmarksRoot;
frontend/src/metabase/collections/components/CollectionSidebar/Bookmarks/Bookmarks.tsx deleted 100644 → 0
+ 0
− 123
View file @ 82256fe0
import React, { useState } from "react";
import { t } from "ttag";
import { PLUGIN_COLLECTIONS } from "metabase/plugins";
import * as Urls from "metabase/lib/urls";
import { color } from "metabase/lib/colors";
import Icon from "metabase/components/Icon";
import Link from "metabase/collections/components/CollectionSidebar/CollectionSidebarLink";
import BookmarkEntity from "metabase/entities/bookmarks";
import { LabelContainer } from "../Collections/CollectionsList/CollectionsList.styled";
import BookmarksRoot, {
BookmarkContainer,
BookmarkListRoot,
BookmarkTypeIcon,
} from "./Bookmarks.styled";
import {
SidebarHeading,
ToggleListDisplayButton,
} from "metabase/collections/components/CollectionSidebar/CollectionSidebar.styled";
import { Bookmark, Bookmarks } from "metabase-types/api";
interface BookmarkProps {
bookmark: Bookmark;
}
interface CollectionSidebarBookmarksProps {
bookmarks: Bookmarks;
deleteBookmark: (id: string, type: string) => void;
}
interface IconProps {
name: string;
tooltip?: string;
isOfficial?: boolean;
}
const BookmarkIcon = ({ bookmark }: BookmarkProps) => {
const icon = BookmarkEntity.objectSelectors.getIcon(bookmark);
const isCollection = bookmark.type === "collection";
const isRegularCollection =
isCollection && PLUGIN_COLLECTIONS.isRegularCollection(bookmark);
const isOfficial = isCollection && !isRegularCollection;
const iconColor = isOfficial ? color("warning") : color("brand");
return <BookmarkTypeIcon {...icon} color={iconColor} />;
};
const Label = ({ bookmark }: BookmarkProps) => {
const icon = BookmarkEntity.objectSelectors.getIcon(bookmark);
return (
<LabelContainer>
<BookmarkIcon bookmark={bookmark} />
{bookmark.name}
</LabelContainer>
);
};
const CollectionSidebarBookmarks = ({
bookmarks,
deleteBookmark,
}: CollectionSidebarBookmarksProps) => {
const storedShouldDisplayBookmarks =
localStorage.getItem("shouldDisplayBookmarks") !== "false";
const [shouldDisplayBookmarks, setShouldDisplayBookmarks] = useState(
storedShouldDisplayBookmarks,
);
if (bookmarks.length === 0) {
return null;
}
const handleDeleteBookmark = ({ item_id: id, type }: Bookmark) => {
deleteBookmark(id.toString(), type);
};
const toggleBookmarkListVisibility = () => {
const booleanForLocalStorage = (!shouldDisplayBookmarks).toString();
localStorage.setItem("shouldDisplayBookmarks", booleanForLocalStorage);
setShouldDisplayBookmarks(!shouldDisplayBookmarks);
};
return (
<BookmarksRoot>
<SidebarHeading onClick={toggleBookmarkListVisibility}>
{t`Bookmarks`}{" "}
<ToggleListDisplayButton
name="play"
shouldDisplayBookmarks={shouldDisplayBookmarks}
size="8"
/>
</SidebarHeading>
{shouldDisplayBookmarks && (
<BookmarkListRoot>
{bookmarks.map((bookmark, index) => {
const { id, name, type } = bookmark;
const url = Urls.bookmark({ id, name, type });
return (
<BookmarkContainer key={`bookmark-${id}`}>
<Link to={url}>
<Label bookmark={bookmark} />
</Link>
<button onClick={() => handleDeleteBookmark(bookmark)}>
<Icon name="bookmark" />
</button>
</BookmarkContainer>
);
})}
</BookmarkListRoot>
)}
</BookmarksRoot>
);
};
export default CollectionSidebarBookmarks;
frontend/src/metabase/collections/components/CollectionSidebar/Bookmarks/index.jsx deleted 100644 → 0
+ 0
− 1
View file @ 82256fe0
export { default } from "./Bookmarks";
frontend/src/metabase/collections/components/CollectionSidebar/CollectionSidebar.styled.tsx deleted 100644 → 0
+ 0
− 77
View file @ 82256fe0
import styled from "@emotion/styled";
import { css } from "@emotion/react";
import { space } from "metabase/styled-components/theme";
import { color } from "metabase/lib/colors";
import Icon from "metabase/components/Icon";
import { breakpointMinSmall } from "metabase/styled-components/theme/media-queries";
import { SIDEBAR_WIDTH } from "metabase/collections/constants";
export const LoadingContainer = styled.div`
color: ${color("brand")};
text-align: center;
`;
export const LoadingTitle = styled.h2`
color: ${color("text-light")};
font-weight: 400;
margin-top: ${space(1)};
`;
export const Sidebar = styled.aside`
bottom: 0;
display: flex;
box-sizing: border-box;
flex-direction: column;
left: 0;
overflow-x: hidden;
overflow-y: auto;
padding-top: ${space(1)};
width: 0;
background-color: transparent;
${breakpointMinSmall} {
width: ${SIDEBAR_WIDTH};
}
`;
export const SidebarHeading = styled.h4`
color: ${color("text-medium")};
font-size: 12px;
font-weight: 700;
font-size: 11px;
margin-left: ${space(2)};
text-transform: uppercase;
letter-spacing: 0.45px;
letter-spacing: 0.5px;
margin-left: ${space(3)};
text-transform: uppercase;
user-select: none;
${({ onClick }) =>
onClick &&
css`
cursor: pointer;
&:hover {
color: ${color("text-dark")};
}
`};
`;
interface ToggleListDisplayButtonProps {
shouldDisplayBookmarks: boolean;
}
export const ToggleListDisplayButton = styled(Icon)<
ToggleListDisplayButtonProps
>`
margin-left: 4px;
transform: translate(0px, -1px);
${({ shouldDisplayBookmarks }) =>
shouldDisplayBookmarks &&
css`
transform: rotate(90deg) translate(-1px, -1px);
`}
`;
frontend/src/metabase/collections/components/CollectionSidebar/CollectionSidebarFooter/CollectionSidebarFooter.jsx deleted 100644 → 0
+ 0
− 32
View file @ 82256fe0
import React from "react";
import PropTypes from "prop-types";
import { t } from "ttag";
import * as Urls from "metabase/lib/urls";
import { PERSONAL_COLLECTIONS } from "metabase/entities/collections";
import CollectionsList from "../Collections/CollectionsList";
import { Container, Icon, Link } from "./CollectionSidebarFooter.styled";
const propTypes = {
isAdmin: PropTypes.bool.isRequired,
};
export default function CollectionSidebarFooter({ isAdmin }) {
return (
<Container>
{isAdmin && (
<Link to={Urls.collection({ id: "users" })}>
<CollectionsList.Icon collection={PERSONAL_COLLECTIONS} />
{t`Other users' personal collections`}
</Link>
)}
<Link to={`/archive`}>
<Icon name="view_archive" />
{t`View archive`}
</Link>
</Container>
);
}
CollectionSidebarFooter.propTypes = propTypes;
frontend/src/metabase/collections/components/CollectionSidebar/CollectionSidebarFooter/CollectionSidebarFooter.styled.jsx deleted 100644 → 0
+ 0
− 27
View file @ 82256fe0
import styled from "@emotion/styled";
import { space } from "metabase/styled-components/theme";
import GenericIcon from "metabase/components/Icon";
import GenericLink from "metabase/core/components/Link";
import { SIDEBAR_SPACER } from "metabase/collections/constants";
export const Container = styled.div`
padding-bottom: ${space(2)};
padding-left: ${SIDEBAR_SPACER * 2}px;
`;
export const Icon = styled(GenericIcon)`
margin-right: ${space(1)};
`;
export const Link = styled(GenericLink)`
align-items: center;
display: flex;
font-weight: 700;
margin-top: ${space(1)};
&:hover {
text-decoration: underline;
}
`;
frontend/src/metabase/collections/components/CollectionSidebar/CollectionSidebarFooter/CollectionSidebarFooter.unit.spec.js deleted 100644 → 0
+ 0
− 27
View file @ 82256fe0
import React from "react";
import { render, screen } from "@testing-library/react";
import CollectionSidebarFooter from "./CollectionSidebarFooter";
it("displays link to archive, including icon", () => {
render(<CollectionSidebarFooter isAdmin={false} />);
screen.getByText("View archive");
screen.getByLabelText("view_archive icon");
});
it("does not display link to other users personal collections if user is not superuser", () => {
render(<CollectionSidebarFooter isAdmin={false} />);
expect(
screen.queryByText("Other users' personal collections"),
).not.toBeInTheDocument();
expect(screen.queryByLabelText("group icon")).not.toBeInTheDocument();
});
it("displays link to other users personal collections if user is superuser", () => {
render(<CollectionSidebarFooter isAdmin={true} />);
screen.getByText("Other users' personal collections");
screen.queryByLabelText("group icon");
});
frontend/src/metabase/collections/components/CollectionSidebar/CollectionSidebarFooter/index.jsx deleted 100644 → 0
+ 0
− 1
View file @ 82256fe0
export { default } from "./CollectionSidebarFooter";
frontend/src/metabase/collections/components/CollectionSidebar/CollectionSidebarLink/CollectionSidebarLink.jsx deleted 100644 → 0
+ 0
− 60
View file @ 82256fe0
import styled from "@emotion/styled";
import { css } from "@emotion/react";
import Link from "metabase/core/components/Link";
import { color } from "metabase/lib/colors";
import { space } from "metabase/styled-components/theme";
import { SIDEBAR_SPACER } from "metabase/collections/constants";
const dimmedIconCss = css`
fill: ${color("brand")};
opacity: 0.8;
`;
const CollectionSidebarLink = styled(Link)`
margin-left: ${props =>
// use negative margin to reset our potentially nested item back by the depth
-props.depth * SIDEBAR_SPACER}px;
padding-left: ${props =>
// now pad it by the depth so we get hover states that are the full width of the sidebar
props.depth * (SIDEBAR_SPACER * 2) + SIDEBAR_SPACER}px;
position: relative;
padding-right: ${space(1)};
padding-top: ${space(1)};
padding-bottom: ${space(1)};
display: flex;
font-size: 13px;
flex-shrink: 0;
align-items: center;
font-weight: bold;
color: ${props => (props.selected ? color("brand") : "text-medium")};
background-color: ${props =>
props.selected
? color("brand-light")
: props.hovered
? color("brand-light")
: "inherit"};
:hover {
color: ${color("brand")};
background-color: ${props =>
props.selected
? false
: props.hovered
? color("brand")
: color("bg-medium")};
}
.Icon {
${props => props.selected && props.dimmedIcon && dimmedIconCss}
}
.Icon-chevronright,
.Icon-chevrondown {
${props => props.selected && dimmedIconCss}
}
`;
CollectionSidebarLink.defaultProps = {
depth: 1,
};
export default CollectionSidebarLink;
frontend/src/metabase/collections/components/CollectionSidebar/CollectionSidebarLink/index.js deleted 100644 → 0
+ 0
− 1
View file @ 82256fe0
export { default } from "./CollectionSidebarLink";
frontend/src/metabase/collections/components/CollectionSidebar/Collections/Collections.jsx deleted 100644 → 0
+ 0
− 62
View file @ 82256fe0
import React from "react";
import PropTypes from "prop-types";
import CollectionsList from "./CollectionsList";
import {
nonPersonalOrArchivedCollection,
currentUserPersonalCollections as getCurrentUserPersonalCollections,
} from "metabase/collections/utils";
import { Container } from "./Collections.styled";
const propTypes = {
collectionId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
currentUserId: PropTypes.number,
list: PropTypes.array,
onClose: PropTypes.func.isRequired,
onOpen: PropTypes.func.isRequired,
openCollections: PropTypes.array,
};
export default function Collections({
collectionId,
currentUserId,
list,
onClose,
onOpen,
openCollections,
}) {
function filterPersonalCollections(collection) {
return !collection.archived;
}
const currentUserPersonalCollections = getCurrentUserPersonalCollections(
list,
currentUserId,
);
return (
<Container>
<div>
<CollectionsList
openCollections={openCollections}
onClose={onClose}
onOpen={onOpen}
collections={currentUserPersonalCollections}
filter={filterPersonalCollections}
currentCollection={collectionId}
/>
</div>
<CollectionsList
openCollections={openCollections}
onClose={onClose}
onOpen={onOpen}
collections={list}
filter={nonPersonalOrArchivedCollection}
currentCollection={collectionId}
/>
</Container>
);
}
Collections.propTypes = propTypes;
frontend/src/metabase/collections/components/CollectionSidebar/Collections/Collections.styled.jsx deleted 100644 → 0
+ 0
− 6
View file @ 82256fe0
import styled from "@emotion/styled";
import { space } from "metabase/styled-components/theme";
export const Container = styled.div`
padding-bottom: ${space(4)};
`;
frontend/src/metabase/collections/components/CollectionSidebar/Collections/Collections.unit.spec.js deleted 100644 → 0
+ 0
− 23
View file @ 82256fe0
import React from "react";
import { renderWithProviders, screen } from "__support__/ui";
import Collections from "./Collections";
const name = "A collection name";
const list = [{ name }];
it("displays entries", () => {
renderWithProviders(
<Collections
collectionId={1}
currentUserId={1}
list={list}
onClose={() => {}}
onOpen={() => {}}
openCollections={[]}
/>,
{ withDND: true },
);
screen.getByText(name);
});
frontend/src/metabase/collections/components/CollectionSidebar/Collections/CollectionsList/CollectionsList.jsx deleted 100644 → 0
+ 0
− 163
View file @ 82256fe0
/* eslint-disable react/prop-types */
import React from "react";
import * as Urls from "metabase/lib/urls";
import Icon from "metabase/components/Icon";
import {
CollectionListIcon,
ChildrenContainer,
ExpandCollectionButton,
LabelContainer,
LabelText,
} from "./CollectionsList.styled";
import CollectionLink from "metabase/collections/components/CollectionSidebar/CollectionSidebarLink";
import CollectionDropTarget from "metabase/containers/dnd/CollectionDropTarget";
import { PLUGIN_COLLECTIONS } from "metabase/plugins";
const IRREGULAR_COLLECTION_ICON_SIZE = 14;
function ToggleChildCollectionButton({ action, collectionId, isOpen }) {
const iconName = isOpen ? "chevrondown" : "chevronright";
function handleClick(e) {
e.preventDefault();
e.stopPropagation();
action(collectionId);
}
return (
<ExpandCollectionButton>
<Icon name={iconName} onClick={handleClick} size={12} />
</ExpandCollectionButton>
);
}
function Label({ action, depth, collection, isOpen }) {
const { children, id, name } = collection;
const isRegular = PLUGIN_COLLECTIONS.isRegularCollection(collection);
const hasChildren =
Array.isArray(children) && children.some(child => !child.archived);
// Workaround: collection icons on the first tree level incorrect offset out of the box
const targetOffsetX =
!isRegular && depth === 1 ? IRREGULAR_COLLECTION_ICON_SIZE : 0;
return (
<LabelContainer>
{hasChildren && (
<ToggleChildCollectionButton
action={action}
collectionId={id}
isOpen={isOpen}
/>
)}
<CollectionListIcon
collection={collection}
targetOffsetX={targetOffsetX}
/>
<LabelText>{name}</LabelText>
</LabelContainer>
);
}
function Collection({
collection,
depth,
currentCollection,
filter,
initialIcon,
onClose,
onOpen,
openCollections,
}) {
const { id, children } = collection;
const isOpen = openCollections.indexOf(id) >= 0;
const action = isOpen ? onClose : onOpen;
return (
<div>
<CollectionDropTarget collection={collection}>
{({ highlighted, hovered }) => {
const url = Urls.collection(collection);
const selected = id === currentCollection;
const dimmedIcon = PLUGIN_COLLECTIONS.isRegularCollection(collection);
// when we click on a link, if there are children,
// expand to show sub collections
function handleClick() {
action(collection.id);
}
return (
<CollectionLink
to={url}
selected={selected}
depth={depth}
onClick={handleClick}
dimmedIcon={dimmedIcon}
hovered={hovered}
highlighted={highlighted}
role="treeitem"
aria-expanded={isOpen}
>
<Label
action={action}
collection={collection}
initialIcon={initialIcon}
isOpen={isOpen}
depth={depth}
/>
</CollectionLink>
);
}}
</CollectionDropTarget>
{children && isOpen && (
<ChildrenContainer>
<CollectionsList
openCollections={openCollections}
onOpen={onOpen}
onClose={onClose}
collections={children}
filter={filter}
currentCollection={currentCollection}
depth={depth + 1}
/>
</ChildrenContainer>
)}
</div>
);
}
function CollectionsList({
collections,
filter,
initialIcon,
depth = 1,
...otherProps
}) {
const filteredCollections = collections.filter(filter);
return (
<div>
{filteredCollections.map(collection => (
<Collection
collection={collection}
depth={depth}
filter={filter}
initialIcon={initialIcon}
key={collection.id}
{...otherProps}
/>
))}
</div>
);
}
CollectionsList.Icon = CollectionListIcon;
export default CollectionsList;
frontend/src/metabase/collections/components/CollectionSidebar/Collections/CollectionsList/CollectionsList.styled.jsx deleted 100644 → 0
+ 0
− 73
View file @ 82256fe0
import React from "react";
import styled from "@emotion/styled";
import { PLUGIN_COLLECTIONS } from "metabase/plugins";
import {
ROOT_COLLECTION,
PERSONAL_COLLECTIONS,
} from "metabase/entities/collections";
import Tooltip from "metabase/components/Tooltip";
import { CollectionIcon } from "metabase/collections/components/CollectionIcon";
const { isRegularCollection } = PLUGIN_COLLECTIONS;
import { SIDEBAR_SPACER, SIDEBAR_WIDTH } from "metabase/collections/constants";
import { color } from "metabase/lib/colors";
import IconButtonWrapper from "metabase/components/IconButtonWrapper";
function getOpacity(collection) {
if (
collection.id === ROOT_COLLECTION.id ||
collection.id === PERSONAL_COLLECTIONS.id
) {
return 1;
}
return isRegularCollection(collection) ? 0.4 : 1;
}
export const CollectionListIcon = styled(CollectionIcon)`
margin-right: 6px;
opacity: ${props => getOpacity(props.collection)};
`;
export const ChildrenContainer = styled.div`
box-sizing: border-box;
margin-left: -${SIDEBAR_SPACER}px;
padding-left: ${SIDEBAR_SPACER + 10}px;
`;
export const ExpandCollectionButton = styled(IconButtonWrapper)`
align-items: center;
color: ${color("white")};
cursor: pointer;
left: -20px;
position: absolute;
`;
const ITEM_NAME_LENGTH_TOOLTIP_THRESHOLD = 35;
const ITEM_NAME_LABEL_WIDTH = Math.round(parseInt(SIDEBAR_WIDTH, 10) * 0.75);
export const LabelContainer = styled.div`
display: flex;
align-items: center;
position: relative;
`;
const Label = styled.span`
width: ${ITEM_NAME_LABEL_WIDTH}px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
`;
export function LabelText({ children: itemName }) {
if (itemName.length >= ITEM_NAME_LENGTH_TOOLTIP_THRESHOLD) {
return (
<Tooltip tooltip={itemName} maxWidth={null}>
<Label>{itemName}</Label>
</Tooltip>
);
}
return itemName;
}
frontend/src/metabase/collections/components/CollectionSidebar/Collections/CollectionsList/CollectionsList.unit.spec.js deleted 100644 → 0
+ 0
− 109
View file @ 82256fe0
import React from "react";
import { renderWithProviders, screen } from "__support__/ui";
import userEvent from "@testing-library/user-event";
import { setupEnterpriseTest } from "__support__/enterprise";
import CollectionsList from "./CollectionsList";
describe("CollectionsList", () => {
function setup({ collections = [], openCollections = [], ...props } = {}) {
renderWithProviders(
<CollectionsList
collections={collections}
openCollections={openCollections}
filter={() => true}
{...props}
/>,
{ withRouter: true, withDND: true },
);
}
function collection({
id,
name = "Collection name",
authority_level = null,
location = "/",
children = [],
archived = false,
} = {}) {
return {
id,
name,
authority_level,
location,
children,
archived,
};
}
it("renders a basic collection", () => {
setup({
collections: [collection({ id: 1, name: "Collection name" })],
});
expect(screen.queryByText("Collection name")).toBeVisible();
});
it("opens child collection when user clicks on collection name", () => {
const onOpen = jest.fn();
setup({
collections: [
collection({
id: 1,
name: "Parent collection name",
children: [
collection({
id: 2,
name: "Child collection name",
location: "/2/",
}),
],
}),
],
onOpen,
});
userEvent.click(screen.getByText("Parent collection name"));
expect(onOpen).toHaveBeenCalled();
});
describe("Collection types", () => {
const regularCollection = collection({ id: 1, authority_level: null });
const officialCollection = collection({
id: 1,
authority_level: "official",
});
describe("OSS", () => {
it("displays folder icon for regular collections", () => {
setup({ collections: [regularCollection] });
expect(screen.queryByLabelText("folder icon")).toBeInTheDocument();
expect(screen.queryByLabelText("badge icon")).toBeNull();
});
it("displays folder icon for official collections", () => {
setup({ collections: [officialCollection] });
expect(screen.queryByLabelText("folder icon")).toBeInTheDocument();
expect(screen.queryByLabelText("badge icon")).toBeNull();
});
});
describe("EE", () => {
beforeAll(() => {
setupEnterpriseTest();
});
it("displays folder icon for regular collections", () => {
setup({ collections: [regularCollection] });
expect(screen.queryByLabelText("folder icon")).toBeInTheDocument();
expect(screen.queryByLabelText("badge icon")).toBeNull();
});
it("displays badge icon for official collections", () => {
setup({ collections: [officialCollection] });
expect(screen.queryByLabelText("folder icon")).toBeNull();
expect(screen.queryByLabelText("badge icon")).toBeInTheDocument();
});
});
});
});
frontend/src/metabase/collections/components/CollectionSidebar/Collections/CollectionsList/index.jsx deleted 100644 → 0
+ 0
− 1
View file @ 82256fe0
export { default } from "./CollectionsList";
frontend/src/metabase/collections/components/CollectionSidebar/Collections/index.jsx deleted 100644 → 0
+ 0
− 1
View file @ 82256fe0
export { default } from "./Collections";
frontend/src/metabase/collections/components/CollectionSidebar/RootCollectionLink/RootCollectionLink.jsx deleted 100644 → 0
+ 0
− 42
View file @ 82256fe0
import React from "react";
import PropTypes from "prop-types";
import { t } from "ttag";
import Collection, { ROOT_COLLECTION } from "metabase/entities/collections";
import * as Urls from "metabase/lib/urls";
import CollectionDropTarget from "metabase/containers/dnd/CollectionDropTarget";
import CollectionsList from "metabase/collections/components/CollectionSidebar/Collections/CollectionsList";
import CollectionLink from "metabase/collections/components/CollectionSidebar/CollectionSidebarLink";
import { Container } from "./RootCollectionLink.styled";
const propTypes = {
isRoot: PropTypes.bool.isRequired,
};
export default function RootCollectionLink({ isRoot }) {
return (
<Collection.Loader id={ROOT_COLLECTION.id}>
{({ collection: root }) => (
<Container>
<CollectionDropTarget collection={root}>
{({ highlighted, hovered }) => (
<CollectionLink
to={Urls.collection({ id: ROOT_COLLECTION.id })}
selected={isRoot}
highlighted={highlighted}
hovered={hovered}
>
<CollectionsList.Icon collection={root} />
{t`Our analytics`}
</CollectionLink>
)}
</CollectionDropTarget>
</Container>
)}
</Collection.Loader>
);
}
RootCollectionLink.propTypes = propTypes;
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment