# pdf-viewer-organize-pages

> PDF viewer organizes pages by reordering, rotating, and deleting them in a side panel.

**Framework:** react  **Component:** PdfViewer  **Variant:** organize-pages

## Get this item

**If you are an agent, fetch the JSON.** Source is inlined, so one request is enough and no tooling is required:

```
GET https://ai.syncfusion.com/r/react/js/pdf-viewer-organize-pages.json
```

**Install Package(s)**

```bash
npm install @syncfusion/ej2-react-pdfviewer
```

**Notes**

- Syncfusion release: 2026 Volume 2 (v34.1.29)
- The Syncfusion package is licensed. The composition in this file is source you own and edit. See https://ai.syncfusion.com/licensing.md

## Source files

### src/components/pdf-viewer-organize-pages/PdfViewer.jsx

```jsx
import { PdfViewerComponent, Toolbar, Magnification, Navigation, LinkAnnotation, BookmarkView, ThumbnailView, Print, TextSelection, TextSearch, Annotation, FormFields, FormDesigner, PageOrganizer, Inject } from '@syncfusion/ej2-react-pdfviewer';

function Default() {
    let viewer;
    let isInitialLoading = true;
    let pageOrganizerSettings = { showImageZoomingSlider: true };
    return (<div>
        <div className='control-section'>
            {/* Render the PDF Viewer */}
            <PdfViewerComponent ref={(scope) => { viewer = scope; }} id="container" documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf" resourceUrl="https://cdn.syncfusion.com/ej2/23.2.6/dist/ej2-pdfviewer-lib" documentLoad={documentLoaded} style={{ 'height': '640px' }} pageOrganizerSettings={pageOrganizerSettings}>
                <Inject services={[Toolbar, Magnification, Navigation, LinkAnnotation, BookmarkView, ThumbnailView, Print, TextSelection, TextSearch, Annotation, FormFields, FormDesigner, PageOrganizer]}/>
            </PdfViewerComponent>
        </div>
    </div>);
    function documentLoaded() {
        if (isInitialLoading) {
            viewer.isPageOrganizerOpen = true;
            isInitialLoading = false;
        }
        else {
            viewer.isPageOrganizerOpen = false;
        }
    }
}
export default Default;
```