FolderCard: Restructure component files

packages/core/upload/admin/src/components/FolderCard/FolderCard/FolderCard.js

@@ -7,8 +7,8 @@ import { Box } from '@strapi/design-system/Box';
 import { Stack } from '@strapi/design-system/Stack';
 import Folder from '@strapi/icons/Folder';
 
-import { FolderCardContext } from './FolderCardContext';
+import { FolderCardContext } from '../contexts/FolderCard';
-import useId from './utils/useId';
+import useId from '../hooks/useId';
 
 const FauxClickWrapper = styled.button`
   height: 100%;
@@ -31,7 +31,7 @@ const StyledFolder = styled(Folder)`
 `;
 
 export const FolderCard = ({ children, id, startAction, ariaLabel, onDoubleClick, ...props }) => {
-  const generatedId = useId(id);
+  const generatedId = useId('folder', id);
 
   return (
     <FolderCardContext.Provider value={{ id: generatedId }}>

packages/core/upload/admin/src/components/FolderCard/FolderCard/index.js

@@ -0,0 +1 @@
+export * from './FolderCard';

packages/core/upload/admin/src/components/FolderCard/FolderCardBody/FolderCardBody.js

@@ -3,7 +3,7 @@ import styled from 'styled-components';
 
 import { Flex } from '@strapi/design-system/Flex';
 
-import { useFolderCard } from './FolderCardContext';
+import { useFolderCard } from '../contexts/FolderCard';
 
 const StyledBox = styled(Flex)`
   user-select: none;

packages/core/upload/admin/src/components/FolderCard/FolderCardBody/index.js

@@ -0,0 +1 @@
+export * from './FolderCardBody';

packages/core/upload/admin/src/components/FolderCard/FolderCardCheckbox/FolderCardCheckbox.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Box } from '@strapi/design-system/Box';
 import { BaseCheckbox } from '@strapi/design-system/BaseCheckbox';
-import { useFolderCard } from './FolderCardContext';
+import { useFolderCard } from '../contexts/FolderCard';
 
 export const FolderCardCheckbox = props => {
   const { id } = useFolderCard();

packages/core/upload/admin/src/components/FolderCard/FolderCardCheckbox/index.js

@@ -0,0 +1 @@
+export * from './FolderCardCheckbox';

packages/core/upload/admin/src/components/FolderCard/contexts/FolderCard.js

@@ -1,6 +1,6 @@
 import { createContext, useContext } from 'react';
 
-export const FolderCardContext = createContext();
+export const FolderCardContext = createContext({});
 
 export function useFolderCard() {
   return useContext(FolderCardContext);

packages/core/upload/admin/src/components/FolderCard/hooks/useId.js

@@ -4,8 +4,8 @@ let id = 0;
 
 const genId = () => ++id;
 
-const useId = (prefix, initialId) => {
+const useId = initialId => {
-  const idRef = useRef(initialId || `${prefix}-${genId()}`);
+  const idRef = useRef(`${initialId}-${genId()}`);
 
   return idRef.current;
 };

packages/core/upload/admin/src/components/FolderCard/index.js

@@ -1,4 +1,5 @@
 export { FolderCard } from './FolderCard';
 export { FolderCardBody } from './FolderCardBody';
 export { FolderCardCheckbox } from './FolderCardCheckbox';
-export { FolderCardLink } from './FolderCardLink';
+
+export { FolderCardLink } from './styled';

packages/core/upload/admin/src/components/FolderCard/tests/FolderCard.test.js

@@ -9,7 +9,7 @@ import { FolderCard } from '../FolderCard';
 import { FolderCardBody } from '../FolderCardBody';
 import { FolderCardCheckbox } from '../FolderCardCheckbox';
 
-const ID_FIXTURE = 'folder-1';
+const ID_FIXTURE = 'folder';
 
 // eslint-disable-next-line react/prop-types
 const ComponentFixture = props => {
@@ -18,7 +18,6 @@ const ComponentFixture = props => {
       <FolderCard
         id={ID_FIXTURE}
         ariaLabel="Folder 1"
-        href="/"
         startAction={<></>}
         onDoubleClick={() => {}}
         {...props}

packages/core/upload/admin/src/components/FolderCard/tests/__snapshots__/FolderCard.test.js.snap

@@ -194,7 +194,6 @@ exports[`FolderCard has all required ids set when rendering a start action 1`] =
 <div>
   <div
     class="c0"
-    href="/"
   >
     <button
       aria-hidden="true"
@@ -212,7 +211,7 @@ exports[`FolderCard has all required ids set when rendering a start action 1`] =
         class="c5"
       >
         <input
-          aria-labelledby="folder-1-3-title"
+          aria-labelledby="folder-3-title"
           class="c6"
           type="checkbox"
         />
@@ -236,7 +235,7 @@ exports[`FolderCard has all required ids set when rendering a start action 1`] =
       </div>
       <h2
         class="c9 c10 c11"
-        id="folder-1-3-title"
+        id="folder-3-title"
       >
         <a
           class="c12"
@@ -403,7 +402,6 @@ exports[`FolderCard renders and matches the snapshot 1`] = `
 <div>
   <div
     class="c0"
-    href="/"
   >
     <button
       aria-hidden="true"
@@ -436,7 +434,7 @@ exports[`FolderCard renders and matches the snapshot 1`] = `
       </div>
       <h2
         class="c7 c8 c9"
-        id="folder-1-1-title"
+        id="folder-1-title"
       >
         <a
           class="c10"