Skip to content

Commit fd891fc

Browse files
committed
fix eslint errors
1 parent 2de2346 commit fd891fc

File tree

2 files changed

+39
-22
lines changed

2 files changed

+39
-22
lines changed

.eslintrc.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,8 @@
1818
"Backbone": "readonly",
1919
"_": "readonly",
2020
"File": "readonly",
21-
"Headers": "readonly"
21+
"Headers": "readonly",
22+
"requestAnimationFrame": "readonly"
2223
},
2324
"extends": ["plugin:@wordpress/eslint-plugin/recommended"],
2425
"ignorePatterns": ["*.json"]

src/js/gutenberg-plugins/content-resizing-plugin.js

+37-21
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,7 @@ const aiIconSvg = (
5555
const DEFAULT_STATE = {
5656
clientId: '',
5757
resizingType: null,
58+
isResizing: false,
5859
};
5960

6061
const resizeContentStore = createReduxStore( 'resize-content-store', {
@@ -71,6 +72,12 @@ const resizeContentStore = createReduxStore( 'resize-content-store', {
7172
...state,
7273
resizingType: action.resizingType,
7374
};
75+
76+
case 'SET_IS_RESIZING':
77+
return {
78+
...state,
79+
isResizing: action.isResizing,
80+
};
7481
}
7582

7683
return state;
@@ -88,6 +95,12 @@ const resizeContentStore = createReduxStore( 'resize-content-store', {
8895
resizingType,
8996
};
9097
},
98+
setIsResizing( isResizing ) {
99+
return {
100+
type: 'SET_IS_RESIZING',
101+
isResizing,
102+
};
103+
},
91104
},
92105
selectors: {
93106
getClientId( state ) {
@@ -96,13 +109,14 @@ const resizeContentStore = createReduxStore( 'resize-content-store', {
96109
getResizingType( state ) {
97110
return state.resizingType;
98111
},
112+
getIsResizing( state ) {
113+
return state.isResizing;
114+
},
99115
},
100116
} );
101117

102118
register( resizeContentStore );
103119

104-
let isProcessAnimating = false;
105-
106120
const ContentResizingPlugin = () => {
107121
// Holds the original text of the block being procesed.
108122
const [ blockContentAsPlainText, setBlockContentAsPlainText ] =
@@ -114,19 +128,19 @@ const ContentResizingPlugin = () => {
114128
// Holds the GPT response array.
115129
const [ textArray, setTextArray ] = useState( [] );
116130

117-
// Indicates if content resizing is in progress.
118-
const [ isResizing, setIsResizing ] = useState( false );
119-
120131
// Indicates if the modal window with the result is open/closed.
121132
const [ isModalOpen, setIsModalOpen ] = useState( false );
122133

123-
const { isMultiBlocksSelected, resizingType } = useSelect( ( __select ) => {
124-
return {
125-
isMultiBlocksSelected:
126-
__select( blockEditorStore ).hasMultiSelection(),
127-
resizingType: __select( resizeContentStore ).getResizingType(),
128-
};
129-
} );
134+
const { isMultiBlocksSelected, resizingType, isResizing } = useSelect(
135+
( __select ) => {
136+
return {
137+
isMultiBlocksSelected:
138+
__select( blockEditorStore ).hasMultiSelection(),
139+
resizingType: __select( resizeContentStore ).getResizingType(),
140+
isResizing: __select( resizeContentStore ).getIsResizing(),
141+
};
142+
}
143+
);
130144

131145
// Sets required states before resizing content.
132146
useEffect( () => {
@@ -139,22 +153,21 @@ const ContentResizingPlugin = () => {
139153

140154
// Triggers AJAX request to resize the content.
141155
useEffect( () => {
142-
if ( isResizing ) {
156+
if ( isResizing && selectedBlock ) {
143157
( async () => {
144158
const __textArray = await getResizedContent();
145159
setTextArray( __textArray );
146160
setIsModalOpen( true );
147161
} )();
148162
}
149-
}, [ isResizing, getResizedContent ] );
163+
}, [ isResizing, selectedBlock ] );
150164

151165
// Resets to default states.
152166
function resetStates() {
153167
setSelectedBlock( null );
154168
setTextArray( [] );
155169
setIsModalOpen( false );
156170
dispatch( resizeContentStore ).setResizingType( null );
157-
isProcessAnimating = false;
158171
}
159172

160173
/**
@@ -169,7 +182,7 @@ const ContentResizingPlugin = () => {
169182

170183
setSelectedBlock( block );
171184
setBlockContentAsPlainText( toPlainText( blockContent ) );
172-
setIsResizing( true );
185+
dispatch( resizeContentStore ).setIsResizing( true );
173186
}
174187

175188
/**
@@ -200,12 +213,12 @@ const ContentResizingPlugin = () => {
200213
if ( 200 === response.status ) {
201214
__textArray = await response.json();
202215
} else {
203-
setIsResizing( false );
216+
dispatch( resizeContentStore ).setIsResizing( false );
204217
dispatch( resizeContentStore ).setClientId( '' );
205218
resetStates();
206219
}
207220

208-
setIsResizing( false );
221+
dispatch( resizeContentStore ).setIsResizing( false );
209222
dispatch( resizeContentStore ).setClientId( '' );
210223

211224
return __textArray;
@@ -385,8 +398,11 @@ registerPlugin( 'tenup-openai-expand-reduce-content', {
385398

386399
const colorsArray = [ '#8c2525', '#ca4444', '#303030' ];
387400

401+
let timeoutId = 0;
402+
388403
function processAnimation( content = '' ) {
389-
if ( isProcessAnimating ) {
404+
if ( ! select( resizeContentStore ).getIsResizing() ) {
405+
clearTimeout( timeoutId );
390406
return;
391407
}
392408

@@ -410,7 +426,7 @@ function processAnimation( content = '' ) {
410426
).innerHTML = formattedCharArray.join( ' ' );
411427
}
412428

413-
setTimeout( () => {
429+
timeoutId = setTimeout( () => {
414430
requestAnimationFrame( () => processAnimation( content ) );
415431
}, 1000 / 1.35 );
416432
}
@@ -451,7 +467,7 @@ const withInspectorControls = createHigherOrderComponent( ( BlockEdit ) => {
451467

452468
const __plainTextContent = toPlainText( props.attributes.content );
453469

454-
if ( ! isProcessAnimating ) {
470+
if ( select( resizeContentStore ).getIsResizing() ) {
455471
requestAnimationFrame( () =>
456472
processAnimation( __plainTextContent )
457473
);

0 commit comments

Comments
 (0)