diff --git a/components/core/CarouselSidebarData.js b/components/core/CarouselSidebarData.js index 1ab7efee..3ff343c7 100644 --- a/components/core/CarouselSidebarData.js +++ b/components/core/CarouselSidebarData.js @@ -11,6 +11,19 @@ import { LoaderSpinner } from "~/components/system/components/Loaders"; import { SlatePicker } from "~/components/core/SlatePicker"; import { dispatchCustomEvent } from "~/common/custom-events"; +import SlateMediaObjectPreview from "~/components/core/SlateMediaObjectPreview"; + +const DEFAULT_BOOK = + "https://slate.textile.io/ipfs/bafkreibk32sw7arspy5kw3p5gkuidfcwjbwqyjdktd5wkqqxahvkm2qlyi"; +const DEFAULT_DATA = + "https://slate.textile.io/ipfs/bafkreid6bnjxz6fq2deuhehtxkcesjnjsa2itcdgyn754fddc7u72oks2m"; +const DEFAULT_DOCUMENT = + "https://slate.textile.io/ipfs/bafkreiecdiepww52i5q3luvp4ki2n34o6z3qkjmbk7pfhx4q654a4wxeam"; +const DEFAULT_VIDEO = + "https://slate.textile.io/ipfs/bafkreibesdtut4j5arclrxd2hmkfrv4js4cile7ajnndn3dcn5va6wzoaa"; +const DEFAULT_AUDIO = + "https://slate.textile.io/ipfs/bafkreig2hijckpamesp4nawrhd6vlfvrtzt7yau5wad4mzpm3kie5omv4e"; + const STYLES_NO_VISIBLE_SCROLL = css` overflow-y: scroll; scrollbar-width: none; @@ -153,7 +166,7 @@ const STYLES_IMAGE_BOX = css` display: flex; align-items: center; justify-content: center; - background-color: ${Constants.system.white}; + background-color: ${Constants.system.black}; overflow: hidden; ${"" /* box-shadow: 0 0 0 1px ${Constants.system.border} inset; */} border-radius: 4px; @@ -167,6 +180,22 @@ const STYLES_GROUPING = css` margin-bottom: 24px; `; +export const FileTypeDefaultPreview = () => { + if (props.type && props.type.startsWith("video/")) { + return DEFAULT_VIDEO; + } + if (props.type && props.type.startsWith("audio/")) { + return DEFAULT_AUDIO; + } + if (props.type && props.type.startsWith("application/epub")) { + return DEFAULT_BOOK; + } + if (props.type && props.type.startsWith("application/pdf")) { + return DEFAULT_DOCUMENT; + } + return DEFAULT_DATA; +}; + export default class CarouselSidebarData extends React.Component { _ref = null; @@ -324,11 +353,19 @@ export default class CarouselSidebarData extends React.Component { This is the preview image of your file.
- + {type && type.startsWith("image/") ? ( + + ) : ( +
+ +
+ )}
Upload image diff --git a/components/core/DataView.js b/components/core/DataView.js index cced6967..175628d9 100644 --- a/components/core/DataView.js +++ b/components/core/DataView.js @@ -460,6 +460,7 @@ export default class DataView extends React.Component { render() { let numChecked = Object.keys(this.state.checked).length || 0; + console.log(this.props.items.blurhash); const header = (
diff --git a/components/core/SlateMediaObjectPreview.js b/components/core/SlateMediaObjectPreview.js index 951d3654..34280ad8 100644 --- a/components/core/SlateMediaObjectPreview.js +++ b/components/core/SlateMediaObjectPreview.js @@ -99,6 +99,7 @@ export default class SlateMediaObjectPreview extends React.Component { if (this.props.type && Validations.isPreviewableImage(this.props.type)) { let blurhash = this.props.blurhash && isBlurhashValid(this.props.blurhash); + console.log("check"); if (this.props.centeredImage) { return (