Skip to content

Commit 258c81d

Browse files
christianalfoniSaraVieira
christianalfoni
authored and
SaraVieira
committed
automatically open directory on drag (codesandbox#3247)
1 parent 2236259 commit 258c81d

File tree

10 files changed

+525
-459
lines changed

10 files changed

+525
-459
lines changed

‎packages/app/src/app/overmind/namespaces/files/actions.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -402,7 +402,7 @@ export const deletedUploadedFile: AsyncAction<{
402402
});
403403

404404
export const filesUploaded: AsyncAction<{
405-
files: any[];
405+
files: { [k: string]: { dataURI: string; type: string } };
406406
directoryShortid: string;
407407
}> = withOwnedSandbox(
408408
async ({ state, effects, actions }, { files, directoryShortid }) => {

‎packages/app/src/app/overmind/namespaces/files/internalActions.ts

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
1-
import { AsyncAction, Action } from 'app/overmind';
1+
import { DiffTab, TabType } from '@codesandbox/common/lib/types';
22
import { NotificationStatus } from '@codesandbox/notifications/lib/state';
3-
4-
import { chunk } from 'lodash-es';
3+
import { Action, AsyncAction } from 'app/overmind';
54
import { MAX_FILE_SIZE } from 'codesandbox-import-utils/lib/is-text';
65
import denormalize from 'codesandbox-import-utils/lib/utils/files/denormalize';
7-
import { DiffTab, TabType } from '@codesandbox/common/lib/types';
6+
import { chunk } from 'lodash-es';
87

98
export const recoverFiles: Action = ({ effects, actions, state }) => {
109
const sandbox = state.editor.currentSandbox;
@@ -60,7 +59,7 @@ export const recoverFiles: Action = ({ effects, actions, state }) => {
6059

6160
export const uploadFiles: AsyncAction<
6261
{
63-
files: any[];
62+
files: { [k: string]: { dataURI: string; type: string } };
6463
directoryShortid: string;
6564
},
6665
{

‎packages/app/src/app/pages/Sandbox/Editor/Workspace/Files/DirectoryEntry/DirectoryChildren/ModuleEntry.tsx

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Module, Directory } from '@codesandbox/common/lib/types';
1+
import { Directory, Module } from '@codesandbox/common/lib/types';
22
import { useOvermind } from 'app/overmind';
33
// eslint-disable-next-line import/extensions
44
import getType from 'app/utils/get-type.ts';
@@ -8,18 +8,20 @@ import Entry from '../Entry';
88

99
interface IModuleEntryProps {
1010
module: Module;
11-
setCurrentModule: (id: string) => void;
12-
markTabsNotDirty: () => void;
13-
depth: number;
14-
renameModule: (title: string, moduleShortid: string) => void;
15-
deleteEntry: (shortid: string, title: string) => void;
16-
discardModuleChanges: (shortid: string) => void;
17-
getModulePath: (
11+
setCurrentModule?: (id: string) => void;
12+
store?: any;
13+
signals?: any;
14+
markTabsNotDirty?: () => void;
15+
depth?: number;
16+
renameModule?: (title: string, moduleShortid: string) => void;
17+
deleteEntry?: (shortid: string, title: string) => void;
18+
discardModuleChanges?: (shortid: string, title: string) => void;
19+
getModulePath?: (
1820
modules: Module[],
1921
directories: Directory[],
2022
id: string
2123
) => string;
22-
renameValidator: (id: string, title: string) => string | false | null;
24+
renameValidator?: (id: string, title: string) => string | false | null;
2325
}
2426

2527
const ModuleEntry: React.FC<IModuleEntryProps> = ({

‎packages/app/src/app/pages/Sandbox/Editor/Workspace/Files/DirectoryEntry/DirectoryChildren/index.tsx

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,27 @@
11
import { HIDDEN_DIRECTORIES } from '@codesandbox/common/lib/templates/constants/files';
2-
import { Module, Directory } from '@codesandbox/common/lib/types';
2+
import { Directory, Module } from '@codesandbox/common/lib/types';
33
import { useOvermind } from 'app/overmind';
44
import { sortBy } from 'lodash-es';
55
import * as React from 'react';
6-
import DirectoryEntry from '..';
6+
77
import ModuleEntry from './ModuleEntry';
8+
import DirectoryEntry from '..';
89

910
interface IDirectoryChildrenProps {
10-
depth: number;
11-
renameModule: (title: string, moduleShortid: string) => void;
12-
setCurrentModule: (id: string) => void;
13-
parentShortid: string;
14-
deleteEntry: (shortid: string, title: string) => void;
15-
isInProjectView: boolean;
16-
markTabsNotDirty: () => void;
17-
discardModuleChanges: (shortid: string) => void;
18-
getModulePath: (
11+
depth?: number;
12+
renameModule?: (title: string, moduleShortid: string) => void;
13+
setCurrentModule?: (id: string) => void;
14+
parentShortid?: string;
15+
deleteEntry?: (shortid: string, title: string) => void;
16+
isInProjectView?: boolean;
17+
markTabsNotDirty?: () => void;
18+
discardModuleChanges?: (shortid: string, title: string) => void;
19+
getModulePath?: (
1920
modules: Module[],
2021
directories: Directory[],
2122
id: string
2223
) => string;
23-
renameValidator: (id: string, title: string) => string | false | null;
24+
renameValidator?: (id: string, title: string) => string | false | null;
2425
}
2526

2627
const DirectoryChildren: React.FC<IDirectoryChildrenProps> = ({

‎packages/app/src/app/pages/Sandbox/Editor/Workspace/Files/DirectoryEntry/Entry/index.tsx

Lines changed: 25 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import theme from '@codesandbox/common/lib/theme';
2+
import { Directory, Module } from '@codesandbox/common/lib/types';
23
import { ContextMenu, Item } from 'app/components/ContextMenu';
3-
import { Module, Directory } from '@codesandbox/common/lib/types';
44
import React, { useState } from 'react';
55
import { DragSource } from 'react-dnd';
66
import EditIcon from 'react-icons/lib/go/pencil';
@@ -18,33 +18,37 @@ import EntryTitle from './EntryTitle';
1818
import { EntryTitleInput } from './EntryTitleInput';
1919

2020
interface IEntryProps {
21-
renameValidator: (id: string, title: string) => string | false | null;
22-
shortid: string;
21+
renameValidator?: (id: string, title: string) => string | false | null;
22+
shortid?: string;
2323
id: string;
24-
title: string;
24+
title?: string;
25+
root?: boolean;
26+
isOpen?: boolean;
27+
hasChildren?: boolean;
28+
closeTree?: any;
2529
rename?: (shortid: string, title: string) => void;
26-
deleteEntry: (shortid: string, title: string) => void;
27-
depth: number;
28-
type: string;
29-
active: boolean;
30-
discardModuleChanges: (shortid: string, title: string) => void;
31-
setCurrentModule: (id: string) => void;
32-
connectDragSource: (node: JSX.Element) => JSX.Element;
33-
onCreateDirectoryClick: () => boolean | void;
34-
onCreateModuleClick: () => boolean | void;
35-
onUploadFileClick: () => boolean | void;
36-
onClick: () => void;
37-
markTabsNotDirty: () => void;
30+
deleteEntry?: (shortid: string, title: string) => void;
31+
depth?: number;
32+
type?: string;
33+
active?: boolean;
34+
discardModuleChanges?: (shortid: string, title: string) => void;
35+
setCurrentModule?: (id: string) => void;
36+
connectDragSource?: (node: JSX.Element) => JSX.Element;
37+
onCreateDirectoryClick?: () => boolean | void;
38+
onCreateModuleClick?: () => boolean | void;
39+
onUploadFileClick?: () => boolean | void;
40+
onClick?: () => void;
41+
markTabsNotDirty?: () => void;
3842
onRenameCancel?: () => void;
39-
getModulePath: (
43+
getModulePath?: (
4044
modules: Module[],
4145
directories: Directory[],
4246
id: string
4347
) => string;
44-
isNotSynced: boolean;
45-
isMainModule: boolean;
46-
moduleHasError: boolean;
47-
rightColors: string[];
48+
isNotSynced?: boolean;
49+
isMainModule?: boolean;
50+
moduleHasError?: boolean;
51+
rightColors?: string[];
4852
state?: string;
4953
}
5054

‎packages/app/src/app/pages/Sandbox/Editor/Workspace/Files/DirectoryEntry/elements.js renamed to ‎packages/app/src/app/pages/Sandbox/Editor/Workspace/Files/DirectoryEntry/elements.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ export const EntryContainer = styled.div`
44
position: relative;
55
`;
66

7-
export const Overlay = styled.div`
7+
export const Overlay = styled.div<{ isOver: boolean }>`
88
position: absolute;
99
top: 0;
1010
bottom: 0;
@@ -14,7 +14,7 @@ export const Overlay = styled.div`
1414
display: ${props => (props.isOver ? 'block' : 'none')};
1515
`;
1616

17-
export const Opener = styled.div`
17+
export const Opener = styled.div<{ open: boolean }>`
1818
height: ${props => (props.open ? '100%' : '0px')};
1919
overflow: hidden;
2020
`;

0 commit comments

Comments
 (0)