# learnpress/4.4.8/assets/src/apps/js/blocks/course-elements/course-level/edit.js

LearnPress – WordPress LMS Plugin for Create and Sell Online Courses, version 4.4.8. 59 lines.

- Page: https://pluginprobe.com/plugins/learnpress/4.4.8/code/assets/src/apps/js/blocks/course-elements/course-level/edit.js
- Raw: https://pluginprobe.com/plugins/learnpress/4.4.8/raw/assets/src/apps/js/blocks/course-elements/course-level/edit.js
- Modified: 2026-09-18T11:22:50+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/learnpress/4.4.8/code/assets/src/apps/js/blocks/course-elements/course-level/edit.js#L10-L20`.

```javascript
import { __ } from '@wordpress/i18n';
import { InspectorControls, useBlockProps } from '@wordpress/block-editor';
import { PanelBody, ToggleControl } from '@wordpress/components';
import { useState, useEffect } from '@wordpress/element';

const Edit = ( props ) => {
	const blockProps = useBlockProps();
	const { attributes, setAttributes, context } = props;
	const { lpCourseData } = context;
	const courseLevel =
		lpCourseData?.level ||
		'<div class="course-count-level"><span class="course-level">All levels</span></div>';

	return (
		<>
			<InspectorControls>
				<PanelBody title={ __( 'Settings', 'learnpress' ) }>
					<ToggleControl
						label={ __( 'Show Label', 'learnpress' ) }
						checked={ attributes.showLabel }
						onChange={ ( value ) => {
							setAttributes( {
								showLabel: value,
							} );
						} }
					/>
					<ToggleControl
						label={ __( 'Show Icon', 'learnpress' ) }
						checked={ attributes.showIcon }
						onChange={ ( value ) => {
							setAttributes( {
								showIcon: value,
							} );
						} }
					/>
				</PanelBody>
			</InspectorControls>
			<div { ...blockProps }>
				<div className="info-meta-item">
					<span className="info-meta-left">
						{ attributes.showIcon && (
							<span dangerouslySetInnerHTML={ { __html: '<i class="lp-icon-signal"></i>' } } />
						) }
						{ attributes.showLabel ? 'Level:' : '' }
					</span>
					<span
						className="info-meta-right"
						dangerouslySetInnerHTML={ {
							__html: courseLevel,
						} }
					></span>
				</div>
			</div>
		</>
	);
};

export default Edit;

```