-
Notifications
You must be signed in to change notification settings - Fork 49
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #36 from RvanderLaan/toolbar
Toolbar
- Loading branch information
Showing
16 changed files
with
563 additions
and
248 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,72 @@ | ||
import React from 'react'; | ||
import { remote } from 'electron'; | ||
import { Button, NonIdealState, ButtonGroup, EditableText } from '@blueprintjs/core'; | ||
|
||
interface IErrorBoundaryState { | ||
hasError: boolean; | ||
error: string; | ||
} | ||
|
||
class ErrorBoundary extends React.Component<{}, IErrorBoundaryState> { | ||
static getDerivedStateFromError(error: any) { | ||
// Update state so the next render will show the fallback UI. | ||
return { hasError: true, error }; | ||
} | ||
state = { | ||
hasError: false, | ||
error: '', | ||
}; | ||
|
||
componentDidCatch(error: any, info: any) { | ||
// TODO: Send error to logging service | ||
const stringifiedError = JSON.stringify(error, Object.getOwnPropertyNames(error), 2); | ||
this.setState({ error: stringifiedError }); | ||
} | ||
|
||
viewInspector() { | ||
remote.getCurrentWebContents() | ||
.openDevTools(); | ||
} | ||
|
||
reloadApplication() { | ||
remote.getCurrentWindow() | ||
.reload(); | ||
} | ||
|
||
render() { | ||
const { hasError, error } = this.state; | ||
if (hasError) { | ||
// You can render any custom fallback UI | ||
return ( | ||
<div className="error-boundary"> | ||
<NonIdealState | ||
icon={<span>😞</span>} | ||
title="Something went wrong." | ||
description="You can try one of the following options or contact the maintainers" | ||
action={<ButtonGroup> | ||
<Button onClick={this.reloadApplication} icon="refresh" intent="primary"> | ||
Reload | ||
</Button> | ||
<Button onClick={this.viewInspector} intent="warning" icon="error"> | ||
View in DevTools | ||
</Button> | ||
<Button disabled intent="danger" icon="database"> | ||
Clear database | ||
</Button> | ||
</ButtonGroup>} | ||
> | ||
<EditableText | ||
className="bp3-intent-danger bp3-monospace-text message" | ||
value={error.toString()} | ||
isEditing={false} | ||
multiline | ||
/> | ||
</NonIdealState> | ||
</div> | ||
); | ||
} | ||
return this.props.children; | ||
} | ||
} | ||
|
||
export default ErrorBoundary; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,71 @@ | ||
import React, { useCallback } from 'react'; | ||
import { observer } from 'mobx-react-lite'; | ||
import { useContext } from 'react'; | ||
import { remote } from 'electron'; | ||
import fse from 'fs-extra'; | ||
import path from 'path'; | ||
|
||
import StoreContext from '../contexts/StoreContext'; | ||
import { Button } from '@blueprintjs/core'; | ||
import FileStore from '../stores/FileStore'; | ||
|
||
const chooseDirectory = async (fileStore: FileStore) => { | ||
const dirs = remote.dialog.showOpenDialog({ | ||
properties: ['openDirectory', 'multiSelections'], | ||
}); | ||
|
||
if (!dirs) { | ||
return; | ||
} | ||
|
||
dirs.forEach(async (dir) => { | ||
// Check if directory | ||
// const stats = await fse.lstat(dirs[0]); | ||
const imgExtensions = ['gif', 'png', 'jpg', 'jpeg']; | ||
|
||
const filenames = await fse.readdir(dir); | ||
const imgFileNames = filenames.filter((f) => | ||
imgExtensions.some((ext) => | ||
f.toLowerCase() | ||
.endsWith(ext)), | ||
); | ||
|
||
imgFileNames.forEach(async (filename) => { | ||
const joinedPath = path.join(dir, filename); | ||
console.log(joinedPath); | ||
fileStore.addFile(joinedPath); | ||
}); | ||
}); | ||
}; | ||
|
||
const ImportForm = () => { | ||
// Todo: Add Location entity to DB, so we can have user-picked directories as well | ||
// Todo: Also show sub-directories in tree | ||
|
||
const { fileStore } = useContext(StoreContext); | ||
|
||
const handleChooseDirectory = useCallback( | ||
() => chooseDirectory(fileStore), | ||
[], | ||
); | ||
|
||
return ( | ||
<> | ||
<Button fill disabled icon="document-open"> | ||
Import images | ||
</Button> | ||
|
||
<Button fill onClick={handleChooseDirectory} icon="folder-shared"> | ||
Import single directory | ||
</Button> | ||
|
||
<Button fill disabled icon="folder-open"> | ||
Import nested directories | ||
</Button> | ||
|
||
{/* Todo: Show progress bar here */} | ||
</> | ||
); | ||
}; | ||
|
||
export default observer(ImportForm); |
Oops, something went wrong.