hey Can anybody help me how should i upload image from my local machine gallery right now i can upload via Image URL but i want to upload the image from gallery please help me to figure it out and if possible share me the code
here is my code :
import React from "react";
import IsolatedBlockEditor, { EditorLoaded } from "@automattic/isolated-block-editor";
import reducer from "@wordpress/preferences/build-module/store/reducer";
import * as selectors from "@wordpress/preferences/build-module/store/selectors";
import * as actions from "@wordpress/preferences/build-module/store/actions";
import "./custom.css";
import "@automattic/isolated-block-editor/build-browser/core.css";
import { addFilter } from "@wordpress/hooks";
import { MediaUpload } from "@wordpress/media-utils";
import { mediaUpload } from "@wordpress/editor";
const CustomEditor = () => {
const settings = {
iso: {
moreMenu: false,
customStores: [
{
name: "core/preferences",
config: {
reducer: reducer,
selectors: selectors,
actions: actions,
},
},
],
},
};
settings.editor.mediaUpload = mediaUpload;
if (settings?.editor?.hasUploadPermissions) {
// Connect the media uploader if it's enabled
settings.editor.mediaUpload = mediaUpload;
addFilter(
"editor.MediaUpload",
"blocks-everywhere/media-upload",
() => MediaUpload
);
} else {
settings.editor.mediaUpload = null;
}
return (
<div>
<h1>Editor!</h1>
<IsolatedBlockEditor
style={{ height: "100%" }}
settings={settings}
onLoad={(parser, rawHandler) => {
console.log("parser: ", parser);
console.log("rawHandler: ", rawHandler);
}}
onSaveContent={(content) => {
console.log("onContentSave", content);
}}
onError={() => {
console.log("error");
}}
>
<EditorLoaded onLoaded={(container) => console.log(container)} />
</IsolatedBlockEditor>
</div>
);
};
export default CustomEditor;
I try this blocks-everywhere editor also, but i cant figure it out how can i do so please help me to figure it out and if someone provide me example code so it would be grete for me...