+
& PickedDispatchProps & { push: (pathname: string) => void }
+export type AddLinksDispatchProps =
+ PickedDispatchProps
+ // & PickedDispatchProps
+ & PickedDispatchProps
+ & { push: (pathname: string) => void }
export type AddLinksProps = AddLinksStateProps & AddLinksDispatchProps
interface AddLinksComponentStateProps {
@@ -33,7 +39,6 @@ interface AddLinksComponentStateProps {
interface CustomRequestMessageProps {
close: () => void,
send: (msg: string) => void,
-
}
interface CustomRequestMessageComponentState {
msg: string
@@ -94,27 +99,32 @@ export class AddLinks extends Component
@@ -54,13 +59,13 @@ export const AddFile: FunctionComponent = ({ close, filesSelected,
-
File size limit: 3gb
- ;
+
;
}
diff --git a/src/renderer/components/dashboard/AddLinks.tsx b/src/renderer/components/dashboard/AddLinks.tsx
index 4e4b9b58..6c899b5a 100644
--- a/src/renderer/components/dashboard/AddLinks.tsx
+++ b/src/renderer/components/dashboard/AddLinks.tsx
@@ -1,7 +1,7 @@
import { Component } from "react";
import React from "react";
import { H1, Text } from "../ui-elements/Text";
-import { AddLinksIcon, UserListAvatar, CloseIcon, BtnAddLinksIcon, RequestSentIcon } from "../ui-elements/Image";
+import { UserListAvatar, CloseIcon, BtnAddLinksIcon, RequestSentIcon } from "../ui-elements/Image";
import { UserList, UserListItem } from "../ui-elements/Dashboard";
import man from "../../assets/man.svg";
import Container from "../ui-elements/Container";
@@ -14,6 +14,8 @@ import Modal from "../ui-elements/Modal";
import Button from "../ui-elements/Button";
import Input from "../ui-elements/Input";
import { SearchActions } from "../../../shared/actions/search";
+// import { BulkImportActions } from "../../../shared/actions/bulkImport";
+import BalanceIndicator from "../../containers/dashboard/BalanceIndicator";
type SearchStatus = "NO_SEARCH" | "SEARCH_RESULT"
export interface AddLinksStateProps {
@@ -23,7 +25,11 @@ export interface AddLinksStateProps {
status: SearchStatus
}
-export type AddLinksDispatchProps = PickedDispatchProps
+
+ push('/Dashboard/MyLinks')} />
finish
-
-
-
- addLinksQueryTextChanged(e.target.value)}
- margin="20px 0 20px 0"
- padding="0 20px"
- />
- 0 ? "visible" : "hidden",
- margin:'30px 0 0 0'
- }}
+
+ {/*
+ this.setState(x))
+ renderResults(queryText, status, users, x => this.setState(x), push)
}
@@ -140,24 +150,34 @@ export class AddLinks extends Component void) => {
+const renderResults = (queryText: string, status: string, users: BdapUser[], setState: (x: AddLinksComponentStateProps) => void, push: (pathname: string) => void) => {
switch (status) {
case "NO_SEARCH":
return queryText.length === 0
- ? Type some characters to find other users...
+ ? <>
+ Type some characters to find other users...
+
+ {
+ event.preventDefault();
+ push("/Dashboard/BulkImport")
+ }}
+ style={{ cursor: 'pointer', color: '#2e77d0' }}
+ >Bulk invite from file...
+
: Type some more characters to find other users...
case "SEARCH_RESULT":
return users.length > 0
- ?
- {users.map(u =>
-
+ {/*
+
+ addLinksQueryTextChanged(e.target.value)}
+ margin="20px 0 20px 0"
+ padding="0 20px"
+ autoFocus={true}
+ />
+ 0 ? "visible" : "hidden",
+ margin: '30px 0 0 0'
+ }}
onClick={() => {
addLinksQueryTextChanged("");
document.getElementById("addLinksInput")!.focus()
- }} />
+ }} />
{/*
@@ -129,7 +139,7 @@ export class AddLinks extends Component
+ ?
+ {users.map(u => setState({ requestModal: true, recipent: u.userName }) }>
+
Request sent
- : setState({ requestModal: true, recipent: u.userName })}>
+ :
+export type BalanceIndicatorProps = BalanceIndicatorStateProps & BalanceIndicatorDispatchProps
+export const BalanceIndicator: FunctionComponent = ({ balance, walletAddress, errorMessage, fundsDialogDismissed, hideLinkWhenMinimized }) => {
+ const [visible, setVisible] = useState(false)
+ const [copied, setCopied] = useState(false);
+ const elemRef = useRef(null);
+
+ const isVisible = visible || errorMessage;
+
+ const cb = useCallback((ev: MouseEvent) => {
+ if (isVisible) {
+ setVisible(false)
+ ev.preventDefault()
+ ev.stopPropagation()
+ fundsDialogDismissed()
+ }
+ }, [isVisible])
+ useOutsideAlerter(elemRef, cb);
+ const borderStyle = isVisible ? "solid 2px #ccc" : "none";
+
+ const outerStyle: CSSProperties = {
+ padding: '6px',
+ display: "block",
+ position: "absolute",
+ zIndex: 10000,
+ top: 0,
+ left: 0,
+ borderBottom: borderStyle,
+ borderRight: borderStyle,
+ backgroundColor: isVisible ? "#ffffff" : "none",
+ borderBottomRightRadius: "8px"
+ }
+
+ return <>
+ {((!hideLinkWhenMinimized) || isVisible) && = ({ err, data, push, previewBulkImport, beginBulkImport, fqdnData }) => {
+ // react hooks FTW!!!!
+ const [
+ error,
+ // setError
+ ] = useState(undefined)
+
+ const [
+ status, setStatus
+ ] = useState('dropzone') // default dropzone;
+
+
+ // currently select only one file
+ const filesSelectedHandler = (files: FilePathInfo[]) => {
+ if(error) {
+ return;
+ }
+ setStatus('preview');
+ const file = files[0];
+ previewBulkImport(file)
+ }
+
+ const renderBody = (status: string, fqdnData: RequestStatus[]) => {
+ switch(status) {
+ case "dropzone":
+ return (<>
+
+
+ close push("/Dashboard/AddLinks")} />
+
+
+
+
+
+ Bulk Import File
+
+
+
+
+ );
+ case "preview":
+ return (<>
+
+
+
+
+ Bulk Import Links Preview
+
+
+
+
+
+
+ {data.split('\n').map((item, idx) => item.length > 0 ?
+
+ {item}
+ : ''
+ )}
+
+
+
+
+ );
+ case "result":
+ return (<>
+
+
+
+
+ Bulk Import Result
+
+
+
+ {err ?
+
+ You have run out of funds. All further link requests are aborted.
+
+ : ''}
+
+
+
+ {fqdnData.map((item,idx) =>
+
+
+ )}
+
+
+
+
+ );
+ default: return;
+ }
+ }
+
+ return = ({ currentSessions }) => <>
-
Request
}
diff --git a/src/renderer/components/dashboard/BalanceIndicator.tsx b/src/renderer/components/dashboard/BalanceIndicator.tsx
new file mode 100644
index 00000000..1029abca
--- /dev/null
+++ b/src/renderer/components/dashboard/BalanceIndicator.tsx
@@ -0,0 +1,97 @@
+import { FunctionComponent, useState, useRef, CSSProperties, useCallback } from "react";
+import React from "react";
+import { QRCode } from "../ui-elements/QRCode"
+import { Text } from "../ui-elements/Text";
+import { useOutsideAlerter } from "../../system/useOutsideAlerter";
+import copyIcon from "../../assets/svgs/copy-32.svg"
+
+import { CopyToClipboard } from 'react-copy-to-clipboard';
+import { delay } from "../../../shared/system/delay";
+import { PickedDispatchProps } from "../../../renderer/system/PickedDispatchProps";
+import { BdapActions } from "../../../shared/actions/bdap";
+
+export interface BalanceIndicatorStateProps {
+ balance: number
+ walletAddress: string
+ errorMessage?: string
+ hideLinkWhenMinimized?: boolean
+}
+export type BalanceIndicatorDispatchProps = PickedDispatchProps
+
+ {
+ e.preventDefault();
+ console.log("balanceIndicator clicked");
+ const show = !isVisible;
+ setVisible(show)
+ if (!show) {
+ fundsDialogDismissed()
+ }
+ }}
+ style={{ cursor: 'pointer', color: (balance > 60) ? '#2e77d0' : 'red' }}
+ >Balance : {balance} credits
+
+ {isVisible && <>
+ {errorMessage &&
}
+
+
+}
\ No newline at end of file
diff --git a/src/renderer/components/dashboard/BulkImport.tsx b/src/renderer/components/dashboard/BulkImport.tsx
new file mode 100644
index 00000000..2bbad05a
--- /dev/null
+++ b/src/renderer/components/dashboard/BulkImport.tsx
@@ -0,0 +1,145 @@
+import { FunctionComponent, useState } from "react";
+import React from "react";
+import { Box } from "../ui-elements/Box";
+import { CloseIcon } from "../ui-elements/Image";
+import { Text } from "../ui-elements/Text";
+import Container from "../ui-elements/Container";
+import { FilePathInfo } from "../../../shared/types/FilePathInfo";
+import { Dropzone, DropzoneError } from "../ui-elements/Dropzone";
+import Button from "../ui-elements/Button";
+import { UserList, UserListItem } from "../ui-elements/Dashboard";
+import { RequestStatus } from "../../../main/sagas/bulkImportSaga";
+
+
+
+export interface BulkImportStateProps {
+ data: string,
+ fqdnData: RequestStatus[],
+ err: boolean
+}
+
+export interface BulkImportsDispatchProps {
+ push: (pathname:string) => void,
+ previewBulkImport: (filepath: FilePathInfo) => void
+ beginBulkImport: (data: string) => void
+}
+
+export type BulkImportProps = BulkImportStateProps & BulkImportsDispatchProps
+
+export const BulkImport: FunctionComponent{errorMessage}
}
+
+
+
+ {copied && {
+ setCopied(true)
+ await delay(2000)
+ setCopied(false)
+ }}>
+ 
+
+
+
+ }
+ COPIED TO CLIPBOARD
}
+ {walletAddress}
+ Link
+ Status
+ {item.link}
+ {item.status}
+
+
+ {renderBody(status, fqdnData)}
+
+
;
+}
+
+
diff --git a/src/renderer/components/dashboard/ClientDownloads.tsx b/src/renderer/components/dashboard/ClientDownloads.tsx
index cbaa8407..3181cd43 100644
--- a/src/renderer/components/dashboard/ClientDownloads.tsx
+++ b/src/renderer/components/dashboard/ClientDownloads.tsx
@@ -10,6 +10,8 @@ import man from "../../assets/man.svg";
import { LinkDisplayName } from "./LinkDisplayName";
import { prettySize } from "../../../shared/system/prettySize";
import CircularProgress from "../ui-elements/CircularProgress";
+import BalanceIndicator from "../../containers/dashboard/BalanceIndicator"
+import { prettyTime } from "../../../shared/system/prettyTime";
export interface ClientDownloadsDispatchProps {
@@ -19,7 +21,8 @@ export interface ClientDownloadsStateProps {
}
export type ClientDownloadsProps = ClientDownloadsDispatchProps & ClientDownloadsStateProps
export const ClientDownloads: FunctionComponent
+
+
= ({ curre
const sessionEntries = entries(currentSessions);
if (!sessionEntries.any()) {
return (<>
-
Nobody is downloading data from you
- ) + ) } else { return sessionEntries .select(([key, downloadState]) => { return (
+
= ({ curre
margin: '0',
width: '0.4px'
}} />
-
-
- {`${downloadState.progressPct}%`}
-
-
+
+ {`${downloadState.progressPct}%`}{downloadState.eta!=null&&<> {prettySize(downloadState.speed)}/s ({prettyTime(downloadState.eta!)})}
+
+
= ({ invites, beginAcceptLink, beginDeclineLink }: InvitesProps) =>
<>
-
+
+
-
- {invites.length>0 ?
-
- {invites.map(({ user, link, link_message }, idx) =>
-
-
+ )}
+ :
+
You have no invites yet 😕
-
+
}
diff --git a/src/renderer/components/dashboard/MyLinks.tsx b/src/renderer/components/dashboard/MyLinks.tsx
index 6204f382..db5baeaa 100644
--- a/src/renderer/components/dashboard/MyLinks.tsx
+++ b/src/renderer/components/dashboard/MyLinks.tsx
@@ -1,83 +1,108 @@
import { FunctionComponent } from "react";
import React from "react";
import { H1, Text } from "../ui-elements/Text";
-import { MyLinksIcon, UserListAvatar, PendingIcon, BtnAddLinksIcon, ViewBtnIcon, CloseIcon } from "../ui-elements/Image";
+import { MyLinksIcon, UserListAvatar, PendingIcon, BtnAddLinksIcon, ViewBtnIcon, CloseIcon, ExportIcon } from "../ui-elements/Image";
import { UserList, UserListItem } from "../ui-elements/Dashboard";
import man from "../../assets/man.svg";
import Container from "../ui-elements/Container";
import { BdapUser } from "../../system/BdapUser";
import { LinkDisplayName } from "./LinkDisplayName";
import Input from "../ui-elements/Input";
-
+import BalanceIndicator from "../../containers/dashboard/BalanceIndicator"
export interface MyLinksStateProps {
users: BdapUser[],
+ allUsers: BdapUser[],
userName: string,
- queryText: string
+ queryText: string,
+ balance: number
}
export interface MyLinksDispatchProps {
push: (pathname: string) => void,
startViewSharedFiles: (userName: string) => void
myLinksQueryTextChanged: (value: string) => void
+ exportMyLinks: () => void
}
export type MyLinksProps = MyLinksStateProps & MyLinksDispatchProps
-export const MyLinks: FunctionComponent = ({ users, push, startViewSharedFiles, userName, myLinksQueryTextChanged, queryText }: MyLinksProps) =>
- <>
-
-
- {invites.length>0 ?
-
-
+
-
-
-
+
-
Add Links
- push('/Dashboard/AddLinks')} />
+export const MyLinks: FunctionComponent = ({ users, push, startViewSharedFiles, userName, myLinksQueryTextChanged, queryText, allUsers, balance, exportMyLinks }: MyLinksProps) => {
+
+
+ return <>
+ | FileEntry)[]
+ downloadableFilesView: (DirectoryEntry | FileEntry)[]
+ currentSharedFilesPath: string
+ currentDownloadableFilesPath: string
linkedUserCommonName?: string
linkedUserName?: string
downloadableFiles: DownloadableFile[]
@@ -30,16 +40,20 @@ export interface SharedFilesDispatchProps {
shareNewFile: () => void
requestFile: (req: FileRequest) => void
removeSharedFile: (filePath: string) => void
+ openDirectory: (navCommand: NavigationCommand) => void
+ upDirectory: (navCommand: BaseNavigationCommand) => void
+ goRoot: (navCommand: NavigationCommand) => void
}
export type SharedFilesProps = SharedFilesStateProps & SharedFilesDispatchProps
-export const SharedFiles: FunctionComponent = ({ close, requestFile, removeSharedFile, shareNewFile, outFiles, linkedUserName, userName, linkedUserCommonName, downloadableFiles, sharedFilesFetchState }) => {
+export const SharedFiles: FunctionComponent = ({ downloadableFilesView, currentSharedFilesPath, currentDownloadableFilesPath, openDirectory, upDirectory, goRoot, close, requestFile, removeSharedFile, shareNewFile, outFilesView, linkedUserName, userName, linkedUserCommonName, sharedFilesFetchState }) => {
const [currentView, setCurrentView] = useState<"shared" | "downloads">("shared")
- const [promptModal, setPromptModal] = useState(false)
+ const [promptModal, setPromptModal] = useState(false)
const [filePath, setFilePath] = useState(undefined)
return <>
- {promptModal && setPromptModal(false) } />}
-
+ {promptModal && setPromptModal(false)} />}
+
= ({ close, reques
setPromptModal(!promptModal)}
- setFilePath={setFilePath}
- />
+ ? setPromptModal(!promptModal)}
+ setFilePath={setFilePath}
+ openDirectory={openDirectory}
+ upDirectory={upDirectory}
+ goRoot={goRoot}
+ currentSharedFilesPath={currentSharedFilesPath}
+ />
}
;
@@ -65,66 +96,149 @@ export const SharedFiles: FunctionComponent = ({ close, reques
interface DownloadViewState {
- downloadableFiles: DownloadableFile[]
+ downloadableFilesView: (DirectoryEntry | FileEntry)[]
+ currentDownloadableFilesPath: string
requestFile: (req: FileRequest) => void
userName: string
ownerUserName: string
sharedFilesFetchState: SharedFilesFetchState
+ openDirectory: (navCommand: NavigationCommand) => void
+ upDirectory: (navCommand: BaseNavigationCommand) => void
+ goRoot: (navCommand: NavigationCommand) => void
+
}
-const DownloadView: FunctionComponent = ({ downloadableFiles, requestFile, userName, ownerUserName, sharedFilesFetchState }) => {
+const DownloadView: FunctionComponent = ({ openDirectory, upDirectory, downloadableFilesView, currentDownloadableFilesPath, requestFile, userName, ownerUserName, sharedFilesFetchState }) => {
+
+ const callUpDirectoryMultiple = (number: number) => {
+ Array.from(Array(number)).forEach((x, i) => {
+ upDirectory({ type: 'downloadableFiles'});
+ })
+ }
+
switch (sharedFilesFetchState) {
case "success":
- return
+ return
@@ -149,66 +263,148 @@ const DeletePrompt: FunctionComponent<{
return (
| FileEntry)[]
+ toggleDeleteModal: (filePath: string) => void,
+ setFilePath: (filePath: string) => void
+ openDirectory: (navCommand: NavigationCommand) => void
+ upDirectory: (navCommand: BaseNavigationCommand) => void
+ goRoot: (navCommand: NavigationCommand) => void
+ currentSharedFilesPath: string
+
}
-const ShareView: FunctionComponent = ({ outFiles, shareNewFile, toggleDeleteModal, setFilePath }) => {
- return (
- <>
-
-
- Your shared files
-
-
-
- {outFiles
- ? blinq(outFiles).select(f =>
-
- {f.relativePath}
-
-
- {
+const ShareView: FunctionComponent = ({ currentSharedFilesPath, outFilesView, shareNewFile, toggleDeleteModal, setFilePath, openDirectory, upDirectory }) => {
+ const callUpDirectoryMultiple = (number: number) => {
+ Array.from(Array(number)).forEach((x, i) => {
+ upDirectory({ type: 'sharedFiles'});
+ })
+ }
+
+ return (
+ = ({ label, onClick,
)
+const BreadcrumbButton = styled('div')<{ type?: string, active?: boolean }>`
+ display: inline-block;
+ min-width: 50px;
+ padding: 4px;
+ margin: 10px 0 10px 0;
+ // border: solid 1px ${(props) => props.active ? '#4a4a4a': '#4a4a4a' };
+ background: ${(props) => props.active ? '#4a4a4a': 'white' };
+ border-radius: 4px;
+ box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.1);
+ // clip-path: ${(props) => props.active ? 'polygon(75% 0%, 88% 50%, 75% 100%, 0% 100%, 0% 54%, 0% 0%) ': ''};
+ cursor: pointer;
+`;
+
const StyledSharedButton = styled('div')<{ white?: boolean , margin?: string}>`
width: 132px;
height: 42px;
@@ -113,7 +126,7 @@ const SharedButton:React.FunctionComponent<{ onClick: () => void, white?: boolea
+
YOUR FILES
@@ -130,6 +143,6 @@ const DownloadButton:React.FunctionComponent<{ onClick: () => void, white?: bool
)
export default StyledButton
-export { ArrowButton, BackArrowButton, LightButton, SharedButton, DownloadButton, BackButton, CustomButton };
+export { ArrowButton, BackArrowButton, LightButton, SharedButton, DownloadButton, BackButton, CustomButton, BreadcrumbButton };
diff --git a/src/renderer/components/ui-elements/CircularProgress.tsx b/src/renderer/components/ui-elements/CircularProgress.tsx
index 08c4095f..0808b24a 100644
--- a/src/renderer/components/ui-elements/CircularProgress.tsx
+++ b/src/renderer/components/ui-elements/CircularProgress.tsx
@@ -9,9 +9,9 @@ const Svg = styled('svg')`
const CircularProgress:React.FunctionComponent<{ progress: number, size: number }> = ({ progress, size }) =>
diff --git a/src/renderer/components/ui-elements/Dashboard.tsx b/src/renderer/components/ui-elements/Dashboard.tsx
index aeff4003..cd5b25f6 100644
--- a/src/renderer/components/ui-elements/Dashboard.tsx
+++ b/src/renderer/components/ui-elements/Dashboard.tsx
@@ -87,7 +87,7 @@ const FilesList = styled('ul')`
`;
const Hovered = styled('div')`
- visibility:hidden;
+ opacity:0;
`;
const Unhovered = styled('div')`
visibility: visible;
@@ -98,12 +98,17 @@ const FilesListItem = styled('li')`
direction: row;
justify-content: space-between;
padding: 0.5em 0.25em;
+ border: 2px solid #e7e7e700;
+ transition : border-color 200ms ease-out;
+ ${Hovered} {
+ transition : opacity 200ms ease-out
+ }
&:hover {
border-radius: 7px;
- border: solid 2px #e7e7e7;
+ border-color: #e7e7e7ff;
};
&:hover ${Hovered} {
- visibility: visible;
+ opacity:1;
}
&:hover ${Unhovered} {
visibility: hidden;
@@ -118,8 +123,11 @@ const FilesListFile = styled('span')`
justify-content: flex-start;
padding: 0;
margin: 0;
+ ${Hovered} {
+ transition : opacity 200ms ease-out
+ }
&:hover ${Hovered} {
- visibility: visible;
+ opacity:1;
}
`;
diff --git a/src/renderer/components/ui-elements/Dropzone.tsx b/src/renderer/components/ui-elements/Dropzone.tsx
index 89216f62..1303ed4f 100644
--- a/src/renderer/components/ui-elements/Dropzone.tsx
+++ b/src/renderer/components/ui-elements/Dropzone.tsx
@@ -1,10 +1,17 @@
-import React from "react";
+import React, { useRef, useEffect, MutableRefObject } from "react";
import { FunctionComponent } from "react";
import { Text } from "./Text";
import { Card } from "./Card";
import Button from "./Button";
import { FilePathInfo } from "../../../shared/types/FilePathInfo";
-export const Dropzone: FunctionComponent = ({ error, filesSelected, multiple, accept }) => {
+export const Dropzone: FunctionComponent = ({ error, filesSelected, directoriesSelected, multiple, accept }) => {
+ const dirFileInputRef: MutableRefObject = useRef(null);
+ useEffect(() => {
+ const elem = dirFileInputRef.current;
+ if (elem) {
+ elem.setAttribute("webkitdirectory", "") //annoyingly, we don't seem to be able to set this as an attr with JSX :(
+ }
+ })
return {
e.preventDefault();
e.dataTransfer.dropEffect = "move";
@@ -36,10 +43,29 @@ export const Dropzone: FunctionComponent = ({ error, filesSelecte
Select file
+ {
+ directoriesSelected
+ &&
+ <>
+ {
+ e.preventDefault();
+ if (!e.currentTarget.files) {
+ return;
+ }
+ const files = [...e.currentTarget.files];
+ directoriesSelected(files.map(f => ({ path: f.path, type: "", size: 0 })))
+ }} style={({ display: "none" })} />
+
+ }
;
};
interface DropzoneDispatchProps {
filesSelected: (files: FilePathInfo[]) => void;
+ directoriesSelected?: (directories: FilePathInfo[]) => void;
}
interface DropzoneStateProps {
error?: DropzoneError;
diff --git a/src/renderer/components/ui-elements/Image.tsx b/src/renderer/components/ui-elements/Image.tsx
index cc5eecb2..020e4b4d 100755
--- a/src/renderer/components/ui-elements/Image.tsx
+++ b/src/renderer/components/ui-elements/Image.tsx
@@ -23,6 +23,10 @@ import cancelicon from "../../assets/cancel.svg";
import downloadicon from "../../assets/svgs/download.svg";
import doneicon from "../../assets/svgs/done.svg";
import erroricon from "../../assets/svgs/error.svg";
+import foldericon from "../../assets/svgs/folder-blue.svg";
+import goback from "../../assets/svgs/goback.svg";
+import rightchevron from "../../assets/svgs/right-chevron.svg";
+import exporticon from "../../assets/svgs/export.svg";
interface ImageProps {
src?: string,
@@ -30,7 +34,7 @@ interface ImageProps {
height?: string,
margin?: string,
white?: boolean,
- onClick?: () => void,
+ onClick?: (e:React.MouseEvent) => void,
cursor?: string,
float?: string,
@@ -107,9 +111,22 @@ const DoneIcon: React.FunctionComponent =
const ErrorIcon: React.FunctionComponent =
({ width, height, margin, onClick, style }) => =
+ ({ width, height, margin, onClick, style }) => =
+ ({ width, height, margin, onClick, style }) => =
+ ({ width, height, margin, onClick, style }) => =
+ ({ width, height, margin, onClick, style }) => = (props) => {
+ const { value, ecLevel, size, bgColor, fgColor, qrStyle, minimumCellSize } = { ...defaultProps, ...props };
+ const canvasRef = React.useRef(null);
+
+ const qrCode = qrGenerator(0, ecLevel!);
+ qrCode.addData(utf16to8(value!));
+ qrCode.make();
+ const length = qrCode.getModuleCount();
+ const cellSize = Math.max(Math.trunc(size! / length), minimumCellSize!);
+ const actualSize = cellSize * length;
+
+ React.useEffect(() => {
+ const canvas: HTMLCanvasElement = ReactDOM.findDOMNode(canvasRef.current!) as HTMLCanvasElement;
+ const ctx: CanvasRenderingContext2D = canvas.getContext('2d')!;
+
+ const scale = (window.devicePixelRatio || 1);
+ canvas.height = canvas.width = actualSize * scale;
+ ctx.scale(scale, scale);
+ ctx.fillStyle = bgColor!;
+ ctx.fillRect(0, 0, actualSize, actualSize);
+ const s = qrStyle === "dots" ? 1 : 0
+ for (let row = 0; row < length; row++) {
+ for (let col = 0; col < length; col++) {
+ if (qrCode.isDark(row, col)) {
+ ctx.fillStyle = fgColor!;
+ const w = (Math.ceil((col + 1) * cellSize) - Math.floor(col * cellSize)) - s;
+ const h = (Math.ceil((row + 1) * cellSize) - Math.floor(row * cellSize)) - s;
+ ctx.fillRect(Math.round(col * cellSize), Math.round(row * cellSize), w, h);
+ }
+ }
+ }
+ drawPositioningPattern(0, 0, length, props, ctx);
+ drawPositioningPattern(length - 7, 0, length, props, ctx);
+ drawPositioningPattern(0, length - 7, length, props, ctx);
+
+
+ }, [value, ecLevel, size, bgColor, fgColor, qrStyle])
+
+ return = { ...SearchActions, ...BdapActions, push };
+const mapDispatchToProps: MapPropsToDispatchObj = { ...SearchActions, ...BdapActions, ...BulkImportActions, push };
export default connect(mapStateToProps, mapDispatchToProps)(AddLinks)
diff --git a/src/renderer/containers/dashboard/BalanceIndicator.ts b/src/renderer/containers/dashboard/BalanceIndicator.ts
new file mode 100644
index 00000000..79e5dc9b
--- /dev/null
+++ b/src/renderer/containers/dashboard/BalanceIndicator.ts
@@ -0,0 +1,17 @@
+import { RendererRootState } from "../../reducers";
+import { BalanceIndicator, BalanceIndicatorDispatchProps, BalanceIndicatorStateProps } from "../../components/dashboard/BalanceIndicator"
+import { MapPropsToDispatchObj } from "../../system/MapPropsToDispatchObj";
+import { connect } from "react-redux";
+import { BdapActions } from "../../../shared/actions/bdap";
+
+const mapStateToProps = (state: RendererRootState, ownProps: { hideLinkWhenMinimized?: boolean }): BalanceIndicatorStateProps => ({
+ balance: state.bdap.balance,
+ walletAddress: state.bdap.topUpAddress || "",
+ errorMessage: state.bdap.insufficientFundsErrorMessage,
+ ...ownProps
+})
+
+const mapDispatchToProps: MapPropsToDispatchObj = { ...BdapActions };
+
+export default connect(mapStateToProps, mapDispatchToProps)(BalanceIndicator)
+
diff --git a/src/renderer/containers/dashboard/BulkImport.ts b/src/renderer/containers/dashboard/BulkImport.ts
new file mode 100644
index 00000000..f4d07747
--- /dev/null
+++ b/src/renderer/containers/dashboard/BulkImport.ts
@@ -0,0 +1,21 @@
+import { RendererRootState } from "../../reducers";
+import { MapPropsToDispatchObj } from "../../system/MapPropsToDispatchObj";
+import { connect } from "react-redux";
+import { BulkImportStateProps, BulkImportsDispatchProps, BulkImport } from "../../components/dashboard/BulkImport";
+import { BulkImportActions } from "../../../shared/actions/bulkImport";
+import { push } from "connected-react-router";
+
+
+
+
+const mapStateToProps = (state: RendererRootState /*, ownProps*/): BulkImportStateProps => {
+ return {
+ data: state.bulkImport.previewData,
+ fqdnData: state.bulkImport.fqdnData,
+ err: state.bulkImport.err
+ };
+};
+
+const mapDispatchToProps: MapPropsToDispatchObj = { ...BulkImportActions, push };
+
+export default connect(mapStateToProps, mapDispatchToProps)(BulkImport)
diff --git a/src/renderer/containers/dashboard/MyLinks.ts b/src/renderer/containers/dashboard/MyLinks.ts
index 104dd70c..5c61e650 100644
--- a/src/renderer/containers/dashboard/MyLinks.ts
+++ b/src/renderer/containers/dashboard/MyLinks.ts
@@ -12,9 +12,9 @@ import { FileSharingActions } from "../../../shared/actions/fileSharing";
import { SearchActions } from "../../../shared/actions/search";
const getUserName = createSelector([(state: RendererRootState) => typeof state.bdap.currentUser !== 'undefined' ? state.bdap.currentUser.object_id : undefined], (user) => user)
-const getUserList = createSelector(
+const getBalance = createSelector([(state: RendererRootState) => state.bdap.balance], (b) => b)
+const getUserListBase = createSelector(
[
- (state: RendererRootState) => state.myLinksSearch.query,
(state: RendererRootState) => state.bdap.users,
(state: RendererRootState) => state.bdap.completeLinks,
(state: RendererRootState) => state.bdap.pendingAcceptLinks,
@@ -22,7 +22,7 @@ const getUserList = createSelector(
(state: RendererRootState) => state.bdap.deniedLinks,
(state: RendererRootState) => typeof state.bdap.currentUser !== 'undefined' ? state.bdap.currentUser.object_full_path : undefined
],
- (query, users, completeLinks, pendingAcceptLinks, pendingRequestLinks, deniedLinks, currentUserFqdn) => {
+ (users, completeLinks, pendingAcceptLinks, pendingRequestLinks, deniedLinks, currentUserFqdn) => {
const linkedUsers = blinq(users)
.join(
completeLinks,
@@ -41,7 +41,7 @@ const getUserList = createSelector(
(u) => ({
userName: u.object_id,
commonName: u.common_name,
- state: "pending"
+ state: "pending-invite"
} as BdapUser))
const pendingRequestUsers = blinq(users)
.join(
@@ -56,6 +56,15 @@ const getUserList = createSelector(
const baseQuery = linkedUsers
.concat(pendingAcceptUsers)
.concat(pendingRequestUsers);
+ return baseQuery
+ });
+const getUserList = createSelector(
+ [
+ (state: RendererRootState) => state.myLinksSearch.query,
+ getUserListBase
+ ],
+ (query, baseQuery) => {
+
return query.length > 0
? baseQuery
.select(bdapUser => ({ bdapUser, commonNameQueryPosition: bdapUser.commonName.indexOf(query), userNameQueryPosition: bdapUser.userName.indexOf(query) }))
@@ -76,7 +85,9 @@ const mapStateToProps = (state: RendererRootState /*, ownProps*/): MyLinksStateP
return {
users: getUserList(state),
userName: getUserName(state)!,
- queryText: state.myLinksSearch.queryText
+ queryText: state.myLinksSearch.queryText,
+ allUsers: getUserListBase(state).toArray(),
+ balance: getBalance(state)
};
};
diff --git a/src/renderer/containers/dashboard/SharedFiles.ts b/src/renderer/containers/dashboard/SharedFiles.ts
index 7568c647..b42392c6 100644
--- a/src/renderer/containers/dashboard/SharedFiles.ts
+++ b/src/renderer/containers/dashboard/SharedFiles.ts
@@ -5,26 +5,86 @@ import { SharedFiles, SharedFilesStateProps, SharedFilesDispatchProps } from "..
import { SharedFilesActions } from "../../../shared/actions/sharedFiles";
import { FileSharingActions } from "../../../shared/actions/fileSharing";
import { RemoveFileActions } from "../../../shared/actions/removeFile";
+import * as path from "path"
+import { createSelector } from 'reselect'
+import { fileListToTree } from "../../../shared/system/file/fileListToTree";
+import { getDirectoryListing } from "../../../shared/system/file/getDirectoryListing";
+import { FileNavigationActions } from "../../../shared/actions/fileNavigation";
+import { blinq } from "blinq";
+const userNameSelector = (state: RendererRootState) => state.sharedFiles.linkedUserName
+const fileWatchUsersSelector = (state: RendererRootState) => state.fileWatch.users;
+const fileWatchUserSelector = createSelector(
+ [
+ userNameSelector,
+ fileWatchUsersSelector
+ ],
+ (linkedUserName, users) => linkedUserName != null ? users[linkedUserName] : undefined
+)
+const outSelector = createSelector(
+ [
+ fileWatchUserSelector,
+ ],
+ fileWatchUser => fileWatchUser ? fileWatchUser.out : undefined)
+const outFilesSelector = createSelector(
+ [
+ outSelector
+ ],
+ out => out ? Object.values(out) : [])
+const sharedFilesDownloadableFilesSelector = (state: RendererRootState) => state.sharedFiles.downloadableFiles;
+const downloadableFilesSelector = createSelector(
+ [
+ sharedFilesDownloadableFilesSelector
+ ],
+ downloadableFiles => downloadableFiles || []
+)
+const outFilesTreeSelector = createSelector([
+ outFilesSelector
+], files => fileListToTree(files))
+
+const downloadableFilesTreeSelector = createSelector([
+ downloadableFilesSelector
+], files => fileListToTree(files))
+
+const sharedFilesPathSelector = (state: RendererRootState) => state.fileNavigation.sharedFilesViewPath.join("/")
+const downloadableFilesPathSelector = (state: RendererRootState) => state.fileNavigation.downloadableFilesViewPath.join("/")
+
+const outFilesCurrentDirectorySelector = createSelector(
+ [
+ outFilesTreeSelector,
+ sharedFilesPathSelector
+ ],
+ (tree, filePath) => blinq(getDirectoryListing(filePath, tree)).orderBy(x => x.type === "directory" ? 0 : 1).thenBy(x => path.basename(x.name!)).toArray())
+
+const downloadableFilesCurrentDirectorySelector = createSelector(
+ [
+ downloadableFilesTreeSelector,
+ downloadableFilesPathSelector
+ ],
+ (tree, filePath) => blinq(getDirectoryListing(filePath, tree)).orderBy(x => x.type === "directory" ? 0 : 1).thenBy(x => path.basename(x.name!)).toArray())
const mapStateToProps = (state: RendererRootState /*, ownProps*/): SharedFilesStateProps => {
+ //const outFiles = outFilesSelector(state);
+ const downloadableFiles = downloadableFilesSelector(state);
+ const outFilesView = outFilesCurrentDirectorySelector(state)
+ const downloadableFilesView = downloadableFilesCurrentDirectorySelector(state);
+ const currentSharedFilesPath = sharedFilesPathSelector(state);
+ const currentDownloadableFilesPath = downloadableFilesPathSelector(state);
return {
- outFiles:
- state.sharedFiles.linkedUserName
- && state.fileWatch.users[state.sharedFiles.linkedUserName]
- && state.fileWatch.users[state.sharedFiles.linkedUserName].out
- ? Object.values(state.fileWatch.users[state.sharedFiles.linkedUserName].out)
- : [],
+ outFilesView,
+ downloadableFilesView,
+ currentSharedFilesPath,
+ currentDownloadableFilesPath,
linkedUserCommonName: state.sharedFiles.linkedCommonName,
linkedUserName: state.sharedFiles.linkedUserName,
userName: state.user.userName!,
- downloadableFiles: state.sharedFiles.downloadableFiles || [],
+ downloadableFiles,
sharedFilesFetchState: state.sharedFiles.state
}
};
-const mapDispatchToProps: MapPropsToDispatchObj = { ...SharedFilesActions, ...FileSharingActions, ...RemoveFileActions };
+const mapDispatchToProps: MapPropsToDispatchObj = { ...FileNavigationActions, ...SharedFilesActions, ...FileSharingActions, ...RemoveFileActions };
export default connect(mapStateToProps, mapDispatchToProps)(SharedFiles)
diff --git a/src/renderer/routes/appRoutes.ts b/src/renderer/routes/appRoutes.ts
index 953fb7bf..b9f404b3 100644
--- a/src/renderer/routes/appRoutes.ts
+++ b/src/renderer/routes/appRoutes.ts
@@ -24,6 +24,7 @@ import RestoreSyncProgress from '../containers/onboarding_restore/RestoreSyncPro
import SecureFilePassword from '../containers/onboarding_restore/SecureFilePassword';
import SharedFiles from '../containers/dashboard/SharedFiles';
import AddFile from '../containers/dashboard/AddFile';
+import BulkImport from '../containers/dashboard/BulkImport';
import { CreatingLinkProgress } from '../components/dashboard/CreatingLinkProgress';
import { ClientDownloads } from '../containers/dashboard/ClientDownloads';
export interface RouteInfo {
@@ -62,7 +63,8 @@ const dashboardRoutingTable = {
sharedFiles: route("/Dashboard/SharedFiles", SharedFiles),
addFile: route("/Dashboard/AddFile", AddFile),
creatingLinkProgress: route("/Dashboard/CreatingLinkProgress", CreatingLinkProgress),
- clientDownloads: route("/Dashboard/Outbox", ClientDownloads)
+ clientDownloads: route("/Dashboard/Outbox", ClientDownloads),
+ bulkImport: route("/Dashboard/BulkImport", BulkImport)
}
export const pushRoute = (route: RouteInfo) => push(route.path)
diff --git a/src/renderer/sagas/navSaga/navSaga.ts b/src/renderer/sagas/navSaga/navSaga.ts
index 5b15ea8a..7cd34004 100644
--- a/src/renderer/sagas/navSaga/navSaga.ts
+++ b/src/renderer/sagas/navSaga/navSaga.ts
@@ -15,11 +15,19 @@ import { AppActions } from "../../../shared/actions/app";
export function* navSaga() {
console.log("nav saga started")
yield* waitForInitialized();
+ const syncIsComplete: boolean = yield select((s: RendererRootState) => s.sync.isComplete)
+ if (!syncIsComplete) {
+ yield* waitForSync();
- yield* waitForSync();
-
+ }
+
const currentState: RendererRootState = yield select()
+ if(currentState.router.location.pathname.startsWith("/Dashboard/")){
+ yield* dashboardNav()
+
+ return;
+ }
if (currentState.user.isOnboarded) {
console.log("nav saga: user is onboarded, navigating to /Main")
yield put(pushRoute(appRoutes.dashboard))
@@ -48,7 +56,7 @@ export function* navSaga() {
yield bdapAccountConfigNavMap.runNav();
yield* waitForWalletCredentials();
}
- else{
+ else {
console.log("nav saga: navigating to Onboarding -- /CreateAccount")
yield put(pushRoute(appRoutes.createAccount))
console.log("nav saga navigating to /CreateAccount")
@@ -57,9 +65,9 @@ export function* navSaga() {
createAccount: take(getType(RootActions.createAccount)),
restoreAccount: take(getType(RootActions.restoreAccount))
})
-
+
let returnedToCreateAccount = false
-
+
if (createAccount) {
yield put(pushRoute(appRoutes.enterUserName))
const bdapAccountConfigNavMap = getNavMap();
@@ -77,8 +85,8 @@ export function* navSaga() {
yield* waitForWalletCredentials();
} else {
yield put(pushRoute(appRoutes.restoreAccount))
-
-
+
+
for (; ;) {
let returnedToRestoreAccount = false
const { passphrase, mnemonicFile, cancelled } = yield race({
@@ -86,7 +94,7 @@ export function* navSaga() {
mnemonicFile: take(getType(RootActions.restoreWithMnemonicFile)),
cancelled: take(getType(RootActions.restoreCancelled))
})
-
+
if (cancelled) {
yield put(pushRoute(appRoutes.createAccount))
returnedToCreateAccount = true
@@ -99,7 +107,7 @@ export function* navSaga() {
restoreNavMap.registerNavAction(RootActions.restoreSync, appRoutes.restoreSyncProgress)
restoreNavMap.registerNavAction(RootActions.restoreFailed, appRoutes.restoreWithPassphrase)
restoreNavMap.registerNavAction(RootActions.restoreSuccess, appRoutes.passwordCreateOrLogin, true) //true parameter indicates stopping condition
-
+
yield restoreNavMap.runNav(); //note: this hangs until we hit a navAction with "stopOnThisAction" parameter `true`
}
else if (mnemonicFile) {
@@ -111,26 +119,26 @@ export function* navSaga() {
restoreNavMap.registerNavAction(RootActions.restoreSync, appRoutes.restoreSyncProgress)
restoreNavMap.registerNavAction(RootActions.restoreFailed, appRoutes.restoreWithMnemonicFile)
restoreNavMap.registerNavAction(RootActions.restoreSuccess, appRoutes.passwordCreateOrLogin, true) //true parameter indicates stopping condition
-
+
yield restoreNavMap.runNav(); //note: this hangs until we hit a navAction with "stopOnThisAction" parameter `true`
}
-
-
+
+
if (returnedToRestoreAccount) continue;
if (returnedToCreateAccount) break
yield* waitForWalletCredentials();
break;
-
+
}
}
if (!returnedToCreateAccount) {
break;
}
}
-
- }
+
}
-
+ }
+
}
diff --git a/src/renderer/system/BdapUserState.ts b/src/renderer/system/BdapUserState.ts
index 616beeae..b8a233a5 100644
--- a/src/renderer/system/BdapUserState.ts
+++ b/src/renderer/system/BdapUserState.ts
@@ -1 +1 @@
-export type BdapUserState = "normal" | "pending" | "linked";
+export type BdapUserState = "normal" | "pending" | "linked" | "pending-invite";
diff --git a/src/renderer/system/useInterval.tsx b/src/renderer/system/useInterval.tsx
new file mode 100644
index 00000000..1207c453
--- /dev/null
+++ b/src/renderer/system/useInterval.tsx
@@ -0,0 +1,17 @@
+import { useEffect, useRef } from "react";
+export function useInterval(callback: () => void, delay: number) {
+ const savedCallback = useRef<(() => void) | null>(null);
+ useEffect(() => {
+ savedCallback.current = callback;
+ }, [callback]);
+ useEffect(() => {
+ function tick() {
+ savedCallback.current && savedCallback.current();
+ }
+ if (delay !== null) {
+ let id = setInterval(tick, delay);
+ return () => clearInterval(id);
+ }
+ return () => { };
+ }, [delay]);
+}
diff --git a/src/renderer/system/useOutsideAlerter.tsx b/src/renderer/system/useOutsideAlerter.tsx
new file mode 100644
index 00000000..be784a54
--- /dev/null
+++ b/src/renderer/system/useOutsideAlerter.tsx
@@ -0,0 +1,18 @@
+import { useEffect, MutableRefObject, useRef } from "react";
+export function useOutsideAlerter(elementRef: MutableRefObject, callback: (ev: MouseEvent) => void) {
+ const savedCallback = useRef<((ev: MouseEvent) => void) | null>(null);
+ useEffect(() => {
+ savedCallback.current = callback;
+ }, [callback]);
+ function handleClickOutside(event: MouseEvent) {
+ if (elementRef.current && !elementRef.current.contains(event.target)) {
+ savedCallback.current && savedCallback.current(event);
+ }
+ }
+ useEffect(() => {
+ document.addEventListener("click", handleClickOutside, { capture: true });
+ return () => {
+ document.removeEventListener("click", handleClickOutside, { capture: true });
+ };
+ });
+}
diff --git a/src/rtc/sagas/helpers/ProgressHandler.ts b/src/rtc/sagas/helpers/ProgressHandler.ts
new file mode 100644
index 00000000..32c8b5d1
--- /dev/null
+++ b/src/rtc/sagas/helpers/ProgressHandler.ts
@@ -0,0 +1 @@
+export type ProgressHandler = (progress: number, speed: number, eta: number | undefined, downloadedBytes: number, size: number) => any;
diff --git a/src/rtc/sagas/helpers/copyFileToRTCPeer.ts b/src/rtc/sagas/helpers/copyFileToRTCPeer.ts
deleted file mode 100644
index d35c6ca2..00000000
--- a/src/rtc/sagas/helpers/copyFileToRTCPeer.ts
+++ /dev/null
@@ -1,105 +0,0 @@
-import { call, race } from "redux-saga/effects";
-import { toArrayBuffer } from "../../../shared/system/bufferConversion";
-import { RTCPeer } from "../../system/webRtc/RTCPeer";
-import { createPromiseResolver } from "../../../shared/system/createPromiseResolver";
-import { delay } from "redux-saga";
-import * as util from 'util'
-import * as fs from 'fs'
-
-const fileReadBufferSize = 65536; // 64KiB
-const maxSendBuffered = 2097152; // 2MiB
-const sendBufferedAmountLowThreshold = 262144; // 256KiB
-
-const fsReadAsync = util.promisify(fs.read);
-const fsCloseAsync = util.promisify(fs.close);
-const fsOpenAsync = util.promisify(fs.open);
-
-export const copyFileToRTCPeer =
-
- (filePath: string, peer: RTCPeer, progressHandler?: ((progress: number, downloadedBytes: number, size: number) => any)) => call(function* () {
- const dataChannel = peer.dataChannel;
- dataChannel.bufferedAmountLowThreshold = sendBufferedAmountLowThreshold;
- let totalRead = 0;
- let totalSent = 0;
- const { size: fileSize }: fs.Stats = yield call(() => fs.promises.stat(filePath))
- var buffer = new Buffer(fileReadBufferSize);
- const fileDescriptor: number = yield call(() => fsOpenAsync(filePath, "r"));
- let currentProgressPct = -1
- for (; ;) {
- console.log("reading chunk");
- const amtToRead = Math.min(fileSize - totalRead, fileReadBufferSize);
- const { bytesRead }: {
- bytesRead: number;
- } = yield call(() => fsReadAsync(fileDescriptor, buffer, 0, amtToRead, totalRead));
- console.log("chunk read");
- if (bytesRead === 0) {
- if (totalSent !== fileSize || totalSent !== totalRead) {
- throw Error("transfer length mismatch");
- }
- break;
- }
- totalRead += bytesRead;
- if (dataChannel.bufferedAmount > maxSendBuffered) {
- console.log("buffer high");
- const pr = createPromiseResolver();
- dataChannel.onbufferedamountlow = () => pr.resolve(true);
-
- const { success } = yield race({
- timeout: call(function* () {
- let currBufAmt = dataChannel.bufferedAmount
- let now = performance.now()
- let moved = false
- for (; ;) {
- yield delay(250)
- moved = moved || dataChannel.bufferedAmount !== currBufAmt
- currBufAmt = dataChannel.bufferedAmount
- if (moved) {
- now = performance.now()
- moved = false
- } else {
- if ((performance.now() - now) > 120000) {
- break
- }
- }
- }
- }),
- success: call(() => pr.promise)
- })
- if (!success) {
- throw Error("timeout")
- }
-
-
- console.log("buffer emptied");
- }
- dataChannel.send(toArrayBuffer(buffer, 0, bytesRead));
- totalSent += bytesRead;
-
- const progressPct = Math.trunc((totalSent / fileSize) * 100)
- if (progressPct != currentProgressPct) {
- currentProgressPct = progressPct
- if (progressHandler) {
- yield progressHandler(currentProgressPct, totalSent, fileSize)
- }
- }
- yield delay(0);
- }
- yield call(() => fsCloseAsync(fileDescriptor));
- let bufferedAmt = dataChannel.bufferedAmount
- let now = performance.now()
- let moved = false
- while (bufferedAmt > 0) {
- yield delay(250);
- moved = moved || dataChannel.bufferedAmount !== bufferedAmt
- bufferedAmt = dataChannel.bufferedAmount
- if (moved) {
- now = performance.now()
- moved = false
- } else {
- if ((performance.now() - now) > 120000) {
- throw Error("timeout")
- }
- }
- }
- });
-
diff --git a/src/rtc/sagas/helpers/copyFromRTCPeerToStream.ts b/src/rtc/sagas/helpers/copyFromRTCPeerToStream.ts
new file mode 100644
index 00000000..11022f22
--- /dev/null
+++ b/src/rtc/sagas/helpers/copyFromRTCPeerToStream.ts
@@ -0,0 +1,146 @@
+import { call, race, take } from "redux-saga/effects";
+import { RTCPeer } from "../../system/webRtc/RTCPeer";
+//import * as util from "util";
+//import * as fs from "fs";
+import { eventChannel, END } from "redux-saga";
+import { createRTCPeerReadStream } from "./createRTCPeerReadStream";
+import progressStream from "progress-stream";
+import { Progress } from "progress-stream";
+import * as stream from "stream";
+import { ProgressHandler } from "./ProgressHandler";
+
+//const fsUnlinkAsync = util.promisify(fs.unlink);
+
+export const copyFromRTCPeerToStream = <
+ T extends string,
+ TData extends string | Blob | ArrayBuffer | ArrayBufferView
+>(
+ stream: stream.Writable,
+ size: number,
+ peer: RTCPeer,
+ progressHandler?: ProgressHandler
+) =>
+ call(function*() {
+ const len = size;
+ //const writeStream = fs.createWriteStream(savePath);
+ const readStream = createRTCPeerReadStream(peer, len);
+
+ //cleanupOperations.push(() => writeStream.close());
+ yield* copyStream(readStream, stream, len, progressHandler);
+ });
+
+function* copyStream(
+ readStream: stream.Readable,
+ writeStream: stream.Writable,
+ len: number,
+ progressHandler?: ProgressHandler
+) {
+ const cleanupOperations: (() => void)[] = [];
+ try {
+ const progStream = progressStream({ length: len, time: 500 });
+ const progressChannel = eventChannel
+
- {users.length>0 ?
- <>
-
+
+ {users.map(u =>
+ {} : u.state === 'pending-invite'
+ ? () => push('/Dashboard/Invites')
+ : () => startViewSharedFiles(u.userName)} >
+
+ )}
+
+
+ : No results.
+ }
:
<>
- You don't have any links yet .
- Go ahead, add someone to your list by clicking Add Links at the top-right.
+ You don't have any links yet .
+ Go ahead, add someone to your list by clicking Add Links at the top-right.
}
+}
diff --git a/src/renderer/components/dashboard/SharedFiles.tsx b/src/renderer/components/dashboard/SharedFiles.tsx
index 0eacd455..6a4d47f7 100644
--- a/src/renderer/components/dashboard/SharedFiles.tsx
+++ b/src/renderer/components/dashboard/SharedFiles.tsx
@@ -3,22 +3,32 @@ import React from "react";
import man from "../../assets/man.svg";
import { Box } from "../ui-elements/Box";
import { LinkDisplayName } from "./LinkDisplayName";
-import { UserListAvatar, CloseIcon, BtnAddLinksIcon, DocumentSvg, DeleteIcon, DownloadIcon, DoneIcon, ErrorIcon } from "../ui-elements/Image";
+import { UserListAvatar, CloseIcon, BtnAddLinksIcon, DocumentSvg, DeleteIcon, DownloadIcon, DoneIcon, ErrorIcon, FolderIcon, GoBackIcon, RightChevronIcon } from "../ui-elements/Image";
import { Text } from "../ui-elements/Text";
-import Button, { SharedButton, DownloadButton, CustomButton } from "../ui-elements/Button";
+import { SharedButton, DownloadButton, CustomButton, BreadcrumbButton } from "../ui-elements/Button";
import { Divider } from "../ui-elements/Divider";
import { FilesList, FilesListItem, FilesListFile, Hovered } from "../ui-elements/Dashboard";
import { SharedFile } from "../../../shared/types/SharedFile";
import { blinq } from "blinq";
import { FileRequest } from "../../../shared/actions/payloadTypes/FileRequest";
-import { DownloadableFile, SharedFilesFetchState } from "../../../shared/reducers/sharedFiles";
+import { SharedFilesFetchState } from "../../../shared/types/SharedFilesFetchState";
+import { DownloadableFile } from "../../../shared/types/DownloadableFile";
import { InlineSpinner } from "../ui-elements/LoadingSpinner";
import { prettySize } from "../../../shared/system/prettySize";
import CircularProgress from "../ui-elements/CircularProgress";
+import BalanceIndicator from "../../containers/dashboard/BalanceIndicator";
+import { DirectoryEntry } from "../../../shared/system/file/DirectoryEntry";
+import { FileEntry } from "../../../shared/system/file/FileEntry";
+import { NavigationCommand, BaseNavigationCommand } from "../../../shared/actions/fileNavigation";
+import * as path from "path"
+import { prettyTime } from "../../../shared/system/prettyTime";
export interface SharedFilesStateProps {
- outFiles: SharedFile[],
+ outFilesView: (DirectoryEntry
+ Add Links
+ push('/Dashboard/AddLinks')} />
+
+ Export Links
+ exportMyLinks()}/>
+
- {users.length>0 ?
- <>
-
- myLinksQueryTextChanged(e.target.value)}
- margin="20px 0 20px 0"
- padding="0 20px"
- />
- {/*
-
- NOTE
-
- adding and removing the element below with a ternary statement
- causes measurable performance issues
+ {allUsers.length > 0 ?
+ <>
+
- {users.map(u =>
-
-
- )}
-
+ NOTE
+
+ adding and removing the element below with a ternary statement
+ causes measurable performance issues
+
+ toggling css visibility below is an optimization that doesn't
+ cause document reflow
+
+
+ */}
+ 0 ? "visible" : "hidden",
+ margin: '30px 0 0 0'
+ }}
+ onClick={() => {
+ myLinksQueryTextChanged("");
+ document.getElementById("myLinksInput")!.focus()
+ }} />
+
+ {
+ users.length > 0
+ ?
+ myLinksQueryTextChanged(e.target.value)}
+ margin="20px 0 20px 0"
+ padding="0 20px"
+ />
+ {/*
- toggling css visibility below is an optimization that doesn't
- cause document reflow
-
-
- */}
- 0 ? "visible" : "hidden",
- margin:'30px 0 0 0'
- }}
- onClick={() => {
- myLinksQueryTextChanged("");
- document.getElementById("myLinksInput")!.focus()
- }} />
-
-
-
- {u.state === 'pending'
- ? Pending
- : View startViewSharedFiles(u.userName)} width="30px" height="30px" margin="0 0 0 1em" />
}
- {/* */}
-
+
+ {u.state === 'pending'
+ ? Pending-Request
+ : u.state === 'pending-invite'
+ ? Pending-Invite
+ : View
}
+ {/* */}
+
+
Files shared with you
+
+ { currentDownloadableFilesPath.length > 0 ?
+ upDirectory({ type: "downloadableFiles" })} style={{cursor: 'pointer'}} width="20%">
+ Go Back
+
+ :
+
+ Go Back
+
+ }
+
+
+
- {blinq(downloadableFiles).select(f =>
-
-
- {f.file.fileName}
-
- ;
+ }
+ if (entry.type === "directory") {
+ const directoryEntry = (entry as DirectoryEntry);
+ return openDirectory({ type: "downloadableFiles", location: directoryEntry.name! })}>
+
+ {path.basename(directoryEntry.name!)}
+
+ {/*
+ {
+ e.preventDefault()
+ e.stopPropagation()
+ toggleDeleteModal(directoryEntry.fullPath!);
+ setFilePath(directoryEntry.fullPath!);
+ }} width="35px" height="20px" margin="5px 10px" />
+ */}
+
+ }
+ throw Error("unexpected entry type")
+
+ })
+
+ : []
+ }
+
- ;
+
+
;
case "failed":
return
+ callUpDirectoryMultiple(currentDownloadableFilesPath.split('/').length)}>
+
+ pShare
+
+
+ {currentDownloadableFilesPath.length>0 ? currentDownloadableFilesPath.split('/').map((item,idx) =>
+ <> callUpDirectoryMultiple(currentDownloadableFilesPath.split('/').length - (idx+1)) }>
+
+ {item}
+
+
+
+ ) : ''}
+
+
+
- {
- (() => {
- switch (f.state) {
- case "downloading": //download progress bars
- return
+ );
+ case "failed": // try again cancel buttons
+ return <>
+
+ Starting
+ );
+ default:
+ return <>;
+ }
+ })()}
+
+
-
- downloading
+ {
+ downloadableFilesView
+ ?
+ blinq(downloadableFilesView)
+ .select(entry => {
+ if (entry.type === "file") {
+ const fileEntry = (entry as FileEntry)
+ const f = fileEntry.fileInfo;
+ return
+
+ {path.basename(f.file.fileName)}
+
+
+ )}
+
;
+ case "ready":
+ return (
+ {(() => {
+ switch (f.state) {
+ case "downloading": //download progress bars
+ return
- )
- case "failed": // try again cancel buttons
- return <>
-
- Starting
- )
- default:
- return <>
- }
- })()
- }
-
-
+
+ downloading{f.eta!=null&&<> {prettySize(f.speed)}/s ({prettyTime(f.eta!)})}
-
-
- case "ready":
- return (
- {prettySize(f.file.size)}
- requestFile({ fileId: f.file.hash, ownerUserName, requestorUserName: userName, fileName: f.file.fileName })} />
-
-
+ {prettySize(f.file.size)}
+ requestFile({ ownerUserName, requestorUserName: userName, fileName: f.file.fileName, type: "file" })} />
+
+
-
-
- Are you sure you wanna delete {filePath ? filePath.split('/').pop(): ''} ?
+
+
+ Are you sure you want to remove {filePath ? path.basename(filePath) : ''} ?
-
- cancel()}>Cancel
-
-
-
+
+ cancel()}>
+ Cancel
+ {
+ if (filePath) {
+ removeSharedFile(filePath);
+ cancel()
+ }
+ }}> Delete
+
+
- )
+ )
}
interface ShareViewProps {
shareNewFile: () => void
- outFiles: SharedFile[]
- toggleDeleteModal: (filePath:string) => void,
- setFilePath: (filePath:string) => void
+ outFilesView: (DirectoryEntry
- share new file
- shareNewFile()} />
-
-
+
+
+ Your shared files
+
+
+
+ { currentSharedFilesPath.length > 0 ?
+ upDirectory({ type: "sharedFiles" })} style={{cursor: 'pointer'}} width="20%">
+ Go Back
+
+ :
+
+ Go Back
+
+ }
+
+
+
+
+ {outFilesView
+ ? blinq(outFilesView)
+ .select(entry => {
+ if (entry.type === "file") {
+ const fileEntry = (entry as FileEntry);
+ const f = fileEntry.fileInfo;
+ return
+
+ {path.basename(f.relativePath)}
+
+
+ {
toggleDeleteModal(f.path);
- setFilePath(f.path)
- }}
- width="35px" height="20px" margin="5px 10px" />
-
- )
- : []}
-
-
-
-
-)
+ setFilePath(f.path);
+ }} width="35px" height="20px" margin="5px 10px" />
+
+ ;
+ }
+ if (entry.type === "directory") {
+ const directoryEntry = (entry as DirectoryEntry);
+ return (
+ openDirectory({ type: "sharedFiles", location: directoryEntry.name! })}
+ >
+
+ {path.basename(directoryEntry.name!)}
+
+
+ {
+ e.preventDefault()
+ e.stopPropagation()
+ toggleDeleteModal(directoryEntry.fullPath!);
+ setFilePath(directoryEntry.fullPath!);
+ }} width="35px" height="20px" margin="5px 10px" />
+
+ )
+ }
+ throw Error("unexpected entry type")
+
+ })
+ : []}
+
+
+
+
+ )
}
diff --git a/src/renderer/components/dashboard/Sidebar.tsx b/src/renderer/components/dashboard/Sidebar.tsx
index 3d276e4b..c3a54cee 100644
--- a/src/renderer/components/dashboard/Sidebar.tsx
+++ b/src/renderer/components/dashboard/Sidebar.tsx
@@ -69,7 +69,7 @@ const tabs: TabInfo[] = [
margin="0 0 0 1em" />,
text: "My Links",
isSelected: (pathname: string) => pathname === '/Dashboard/MyLinks' || pathname === '/Dashboard/AddLinks'
- || pathname === '/Dashboard/SharedFiles' || pathname === '/Dashboard/AddFile'
+ || pathname === '/Dashboard/SharedFiles' || pathname === '/Dashboard/AddFile' || pathname === '/Dashboard/BulkImport'
},
{
location: '/Dashboard/Inbox',
diff --git a/src/renderer/components/ui-elements/Button.tsx b/src/renderer/components/ui-elements/Button.tsx
index 8c069db6..89905b9c 100755
--- a/src/renderer/components/ui-elements/Button.tsx
+++ b/src/renderer/components/ui-elements/Button.tsx
@@ -94,6 +94,19 @@ const ArrowButton:React.FunctionComponent
+ share new file
+ shareNewFile()} />
+
+
+ callUpDirectoryMultiple(currentSharedFilesPath.split('/').length)}>
+
+ pShare
+
+
+ {currentSharedFilesPath.length>0 ? currentSharedFilesPath.split('/').map((item,idx) =>
+ <> callUpDirectoryMultiple(currentSharedFilesPath.split('/').length - (idx+1)) }>
+
+ {item}
+
+
+
+ ) : ''}
+
+
+
+
+
+}
\ No newline at end of file
diff --git a/src/renderer/containers/dashboard/AddLinks.ts b/src/renderer/containers/dashboard/AddLinks.ts
index b6c70799..c45be26f 100644
--- a/src/renderer/containers/dashboard/AddLinks.ts
+++ b/src/renderer/containers/dashboard/AddLinks.ts
@@ -9,6 +9,7 @@ import { blinq } from "blinq";
import { push } from "connected-react-router";
import { filterDeniedUsers } from "./helpers/filterDeniedUsers";
import { SearchActions } from "../../../shared/actions/search";
+import { BulkImportActions } from "../../../shared/actions/bulkImport";
@@ -71,6 +72,6 @@ const mapStateToProps = (state: RendererRootState /*, ownProps*/): AddLinksState
};
};
-const mapDispatchToProps: MapPropsToDispatchObj