/home/smartbloks/.trash/eazydocs/src/shortcode/edit.js
import { __ } from '@wordpress/i18n';
import {
useBlockProps,
InspectorControls,
RichText,
} from '@wordpress/block-editor';
import { __experimentalNumberControl as NumberControl } from '@wordpress/components';
import { PanelBody, FormTokenField, RangeControl, TextControl } from '@wordpress/components';
import { useState } from '@wordpress/element';
import { useSelect } from '@wordpress/data';
const { Fragment } = wp.element;
// editor style
import './editor.scss';
// Custom functions
import {doc_ids} from "../custom-functions";
// colors
import colors from '../colors-palette';
export default function Edit( { attributes, setAttributes } ) {
const { col, include, exclude, show_docs, show_articles, more, list } = attributes;
const blockProps = useBlockProps();
const docs = useSelect( (select) => {
return select("core").getEntityRecords('postType', 'docs', {
parent: 0,
status: ['publish', 'private']
})
}, [])
const docSuggestions = docs && docs.map( ( doc ) => {
return doc.id + " | " + doc.title.rendered
})
// console.log( docSuggestions )
// Set attributes value
const onChangeCol = ( newCol ) => {
setAttributes({
col: newCol == '' ? 3 : newCol
})
}
// Shortcode attributes
let include_doc_ids = doc_ids(include) ? 'include="'+doc_ids(include)+'"' : '';
let exclude_doc_ids = doc_ids(exclude) ? 'exclude="'+doc_ids(exclude)+'"' : '';
let columns = col ? 'col="'+col+'"' : '';
let ppp = show_docs ? 'show_docs="'+show_docs+'"' : '';
let articles = show_articles ? 'show_articles="'+show_articles+'"' : '';
let more_txt = more ? 'more="'+more+'"' : '';
return (
<>
<InspectorControls>
<PanelBody
title={__('Filters', 'eazydocs')}
initialOpen={true}
>
<RangeControl
initialPosition={3}
label={__('Columns', 'eazydocs')}
max={4}
min={1}
shiftStep={ 1 }
onChange={ onChangeCol }
/>
<NumberControl
label={__('Docs Show Count', 'eazydocs')}
isShiftStepEnabled={ true }
onChange={(value) => setAttributes({ show_docs: value })}
shiftStep={ 1 }
value={ show_docs }
min={1}
__nextHasNoMarginBottom
/>
<small>{__('How many docs to display.', 'eazydocs')}</small>
<br/><br/>
<NumberControl
label={__('Docs Article Count', 'eazydocs')}
isShiftStepEnabled={ true }
onChange={(value) => setAttributes({ show_articles: value })}
shiftStep={ 1 }
value={ show_articles }
min={1}
__nextHasNoMarginBottom
/>
<small>{__('Articles/child-docs show under every Docs.', 'eazydocs')}</small>
<br/><br/>
<FormTokenField
__experimentalAutoSelectFirstMatch
__experimentalExpandOnFocus
label={__('Docs to Show', 'eazydocs')}
suggestions={ docSuggestions}
value={include}
onChange={(value) => setAttributes({ include: value })}
/>
<FormTokenField
__experimentalAutoSelectFirstMatch
__experimentalExpandOnFocus
label={__('Docs Not to Show', 'eazydocs')}
suggestions={ docSuggestions}
value={exclude}
onChange={(value) => setAttributes({ exclude: value })}
/>
<TextControl
help={__('Button/link to get the full docs', 'eazydocs')}
label={__('More Button Label', 'eazydocs')}
value={more}
onChange={(value) => setAttributes({ more: value })}
/>
</PanelBody>
</InspectorControls>
<div { ...blockProps }>
[eazydocs {columns} {include_doc_ids} {exclude_doc_ids} {ppp} {articles} {more_txt}]
</div>
</>
);
}