-
Notifications
You must be signed in to change notification settings - Fork 5
/
index.js
109 lines (96 loc) · 2.72 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
import React from 'react'
import ReactDOM from 'react-dom'
/**
* WordPress dependencies
*/
import '@wordpress/editor'; // This shouldn't be necessary
import '@wordpress/format-library';
import { useSelect, useDispatch } from '@wordpress/data';
import { useEffect, useState, useMemo } from '@wordpress/element';
import { serialize, parse } from '@wordpress/blocks';
import {
BlockEditorKeyboardShortcuts,
BlockEditorProvider,
BlockList,
BlockInspector,
WritingFlow,
ObserveTyping,
BlockBreadcrumb,
} from '@wordpress/block-editor';
import {
EditorHistoryRedo,
EditorHistoryUndo,
} from '@wordpress/editor';
/**
* Internal dependencies
*/
import Sidebar from 'components/sidebar';
import { uploadMedia } from 'utils';
function BlockEditor( { input, settings: _settings } ) {
const [ blocks, updateBlocks ] = useState( [] );
const { createInfoNotice } = useDispatch( 'core/notices' );
// const canUserCreateMedia = useSelect( ( select ) => {
// const _canUserCreateMedia = select( 'core' ).canUser( 'create', 'media' );
// return _canUserCreateMedia || _canUserCreateMedia !== false;
// }, [] );
const canUserCreateMedia = true;
const settings = useMemo(() => {
if ( ! canUserCreateMedia ) {
return _settings;
}
return {
..._settings,
mediaUpload( { onError, ...rest } ) {
uploadMedia( {
wpAllowedMimeTypes: _settings.allowedMimeTypes,
onError: ( { message } ) => onError( message ),
...rest,
} );
},
};
}, [ canUserCreateMedia, _settings ] );
useEffect( () => {
console.log(input);
updateBlocks( () => parse( input.value ) );
// const storedBlocks = window.localStorage.getItem( 'getdavesbeBlocks' );
//
// if ( storedBlocks && storedBlocks.length ) {
// updateBlocks( () => parse( storedBlocks ) );
// createInfoNotice( 'Blocks loaded', {
// type: 'snackbar',
// isDismissible: true,
// } );
// }
}, [] );
function persistBlocks( newBlocks ) {
updateBlocks( newBlocks );
input.value = serialize(newBlocks);
//window.localStorage.setItem( 'getdavesbeBlocks', serialize( newBlocks ) );
}
return (
<div className="getdavesbe-block-editor">
<BlockEditorProvider
value={ blocks }
onInput={ updateBlocks }
onChange={ persistBlocks }
settings={ settings }
>
<BlockBreadcrumb />
<EditorHistoryUndo />
<EditorHistoryRedo />
<Sidebar.InspectorFill>
<BlockInspector />
</Sidebar.InspectorFill>
<div className="editor-styles-wrapper">
<BlockEditorKeyboardShortcuts />
<WritingFlow>
<ObserveTyping>
<BlockList className="getdavesbe-block-editor__block-list" />
</ObserveTyping>
</WritingFlow>
</div>
</BlockEditorProvider>
</div>
);
}
export default BlockEditor;