diff --git a/frontend/src/Editor/Components/Table/Pagination.jsx b/frontend/src/Editor/Components/Table/Pagination.jsx
new file mode 100644
index 0000000000..ba5b5180f7
--- /dev/null
+++ b/frontend/src/Editor/Components/Table/Pagination.jsx
@@ -0,0 +1,70 @@
+import React, { useState, useEffect } from 'react';
+
+export const Pagination = function Pagination({
+ onPageIndexChanged,
+ serverSide,
+ autoGotoPage,
+ autoCanNextPage,
+ autoPageCount
+}) {
+ const [pageIndex, setPageIndex] = useState(1);
+ const [pageCount, setPageCount] = useState(autoPageCount);
+
+ useEffect(() => {
+ setPageCount(autoPageCount);
+ }, [autoPageCount]);
+
+ function gotoPage(page) {
+ setPageIndex(page);
+ onPageIndexChanged(page);
+ if (!serverSide) {
+ autoGotoPage(page - 1);
+ }
+ }
+
+ function goToNextPage() {
+ gotoPage(pageIndex + 1);
+ }
+
+ function goToPreviousPage() {
+ gotoPage(pageIndex - 1);
+ }
+
+ return (
+
+ {!serverSide
+ &&
+ }
+ {' '}
+
+
+ {pageIndex}
+
+
+ {' '}
+
+ {!serverSide
+ &&
+ }
+
+ );
+};
diff --git a/frontend/src/Editor/Inspector/Elements/Toggle.jsx b/frontend/src/Editor/Inspector/Elements/Toggle.jsx
new file mode 100644
index 0000000000..66a31b1db7
--- /dev/null
+++ b/frontend/src/Editor/Inspector/Elements/Toggle.jsx
@@ -0,0 +1,26 @@
+import React from 'react';
+import { getToolTipProps } from './utils';
+
+export const Toggle = ({
+ param, definition, onChange, paramType, componentMeta
+}) => {
+ const value = definition ? definition.value : false;
+ const paramMeta = componentMeta[paramType][param.name];
+ const displayName = paramMeta.displayName || param.name;
+
+ return (
+
+
+
+ );
+};
diff --git a/frontend/src/Editor/Inspector/TypeMapping.js b/frontend/src/Editor/Inspector/TypeMapping.js
index 76dfdb761a..949acbef78 100644
--- a/frontend/src/Editor/Inspector/TypeMapping.js
+++ b/frontend/src/Editor/Inspector/TypeMapping.js
@@ -3,5 +3,6 @@ export const TypeMapping = {
string: 'Text',
color: 'Color',
json: 'Json',
- code: 'Code'
+ code: 'Code',
+ toggle: 'Toggle'
};
diff --git a/frontend/src/Editor/Inspector/Utils.js b/frontend/src/Editor/Inspector/Utils.js
index 18e1e48ab3..236ec4e26d 100644
--- a/frontend/src/Editor/Inspector/Utils.js
+++ b/frontend/src/Editor/Inspector/Utils.js
@@ -3,6 +3,7 @@ import { Text } from './Elements/Text';
import { Color } from './Elements/Color';
import { Json } from './Elements/Json';
import { Code } from './Elements/Code';
+import { Toggle } from './Elements/Toggle';
import { TypeMapping } from './TypeMapping';
import { EventSelector } from './EventSelector';
@@ -10,7 +11,8 @@ const AllElements = {
Color,
Json,
Text,
- Code
+ Code,
+ Toggle
};
export function renderElement(component, componentMeta, paramUpdated, dataQueries, param, paramType, components = {}) {