diff --git a/packages/grafnode-components/src/components/ResponsePane/ResponseSize/StyledWrapper.js b/packages/grafnode-components/src/components/ResponsePane/ResponseSize/StyledWrapper.js
new file mode 100644
index 000000000..03110e144
--- /dev/null
+++ b/packages/grafnode-components/src/components/ResponsePane/ResponseSize/StyledWrapper.js
@@ -0,0 +1,9 @@
+import styled from 'styled-components';
+
+const Wrapper = styled.div`
+ font-size: 0.75rem;
+ font-weight: 600;
+ color: rgb(117 117 117);
+`;
+
+export default Wrapper;
diff --git a/packages/grafnode-components/src/components/ResponsePane/ResponseSize/index.js b/packages/grafnode-components/src/components/ResponsePane/ResponseSize/index.js
new file mode 100644
index 000000000..83d6bfc1b
--- /dev/null
+++ b/packages/grafnode-components/src/components/ResponsePane/ResponseSize/index.js
@@ -0,0 +1,11 @@
+import React from 'react';
+import StyledWrapper from './StyledWrapper';
+
+const ResponseSize = () => {
+ return (
+
+ 8.31KB
+
+ )
+};
+export default ResponseSize;
\ No newline at end of file
diff --git a/packages/grafnode-components/src/components/ResponsePane/ResponseTime/StyledWrapper.js b/packages/grafnode-components/src/components/ResponsePane/ResponseTime/StyledWrapper.js
new file mode 100644
index 000000000..03110e144
--- /dev/null
+++ b/packages/grafnode-components/src/components/ResponsePane/ResponseTime/StyledWrapper.js
@@ -0,0 +1,9 @@
+import styled from 'styled-components';
+
+const Wrapper = styled.div`
+ font-size: 0.75rem;
+ font-weight: 600;
+ color: rgb(117 117 117);
+`;
+
+export default Wrapper;
diff --git a/packages/grafnode-components/src/components/ResponsePane/ResponseTime/index.js b/packages/grafnode-components/src/components/ResponsePane/ResponseTime/index.js
new file mode 100644
index 000000000..21dc40823
--- /dev/null
+++ b/packages/grafnode-components/src/components/ResponsePane/ResponseTime/index.js
@@ -0,0 +1,11 @@
+import React from 'react';
+import StyledWrapper from './StyledWrapper';
+
+const ResponseTime = () => {
+ return (
+
+ 2.8s
+
+ )
+};
+export default ResponseTime;
\ No newline at end of file
diff --git a/packages/grafnode-components/src/components/ResponsePane/StatusCode/StyledWrapper.js b/packages/grafnode-components/src/components/ResponsePane/StatusCode/StyledWrapper.js
new file mode 100644
index 000000000..5f8b24082
--- /dev/null
+++ b/packages/grafnode-components/src/components/ResponsePane/StatusCode/StyledWrapper.js
@@ -0,0 +1,8 @@
+import styled from 'styled-components';
+
+const Wrapper = styled.div`
+ font-size: 0.75rem;
+ font-weight: 600;
+`;
+
+export default Wrapper;
diff --git a/packages/grafnode-components/src/components/ResponsePane/StatusCode/index.js b/packages/grafnode-components/src/components/ResponsePane/StatusCode/index.js
new file mode 100644
index 000000000..806bbd6b1
--- /dev/null
+++ b/packages/grafnode-components/src/components/ResponsePane/StatusCode/index.js
@@ -0,0 +1,11 @@
+import React from 'react';
+import StyledWrapper from './StyledWrapper';
+
+const StatusCode = () => {
+ return (
+
+ 200 OK
+
+ )
+};
+export default StatusCode;
\ No newline at end of file
diff --git a/packages/grafnode-components/src/components/ResponsePane/index.js b/packages/grafnode-components/src/components/ResponsePane/index.js
index 339612563..6a0cad090 100644
--- a/packages/grafnode-components/src/components/ResponsePane/index.js
+++ b/packages/grafnode-components/src/components/ResponsePane/index.js
@@ -2,6 +2,9 @@ import React, { useState } from 'react';
import classnames from 'classnames';
import QueryResult from './QueryResult';
import ResponseHeaders from './ResponseHeaders';
+import StatusCode from './StatusCode';
+import ResponseTime from './ResponseTime';
+import ResponseSize from './ResponseSize';
import StyledWrapper from './StyledWrapper';
const ResponsePane = ({rightPaneWidth, data, isLoading, headers}) => {
@@ -41,6 +44,11 @@ const ResponsePane = ({rightPaneWidth, data, isLoading, headers}) => {
setSelectedTab('response')}>Response
setSelectedTab('headers')}>Headers
+
+
+
+
+
{getTabPanel(selectedTab)}