feat(#BRU-10) - codeeditor syntax colors for system theme (#1595)

This commit is contained in:
lohit 2024-02-19 17:30:49 +05:30 committed by GitHub
parent fee3416c85
commit e2d754702a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
11 changed files with 24 additions and 24 deletions

View File

@ -11,7 +11,7 @@ import StyledWrapper from './StyledWrapper';
const Docs = ({ collection }) => {
const dispatch = useDispatch();
const { storedTheme } = useTheme();
const { displayedTheme } = useTheme();
const [isEditing, setIsEditing] = useState(false);
const docs = get(collection, 'root.docs', '');
const preferences = useSelector((state) => state.app.preferences);
@ -40,7 +40,7 @@ const Docs = ({ collection }) => {
{isEditing ? (
<CodeEditor
collection={collection}
theme={storedTheme}
theme={displayedTheme}
value={docs || ''}
onEdit={onEdit}
onSave={onSave}

View File

@ -12,7 +12,7 @@ const Script = ({ collection }) => {
const requestScript = get(collection, 'root.request.script.req', '');
const responseScript = get(collection, 'root.request.script.res', '');
const { storedTheme } = useTheme();
const { displayedTheme } = useTheme();
const preferences = useSelector((state) => state.app.preferences);
const onRequestScriptEdit = (value) => {
@ -44,7 +44,7 @@ const Script = ({ collection }) => {
<CodeEditor
collection={collection}
value={requestScript || ''}
theme={storedTheme}
theme={displayedTheme}
onEdit={onRequestScriptEdit}
mode="javascript"
onSave={handleSave}
@ -56,7 +56,7 @@ const Script = ({ collection }) => {
<CodeEditor
collection={collection}
value={responseScript || ''}
theme={storedTheme}
theme={displayedTheme}
onEdit={onResponseScriptEdit}
mode="javascript"
onSave={handleSave}

View File

@ -11,7 +11,7 @@ const Tests = ({ collection }) => {
const dispatch = useDispatch();
const tests = get(collection, 'root.request.tests', '');
const { storedTheme } = useTheme();
const { displayedTheme } = useTheme();
const preferences = useSelector((state) => state.app.preferences);
const onEdit = (value) => {
@ -30,7 +30,7 @@ const Tests = ({ collection }) => {
<CodeEditor
collection={collection}
value={tests || ''}
theme={storedTheme}
theme={displayedTheme}
onEdit={onEdit}
mode="javascript"
onSave={handleSave}

View File

@ -11,7 +11,7 @@ import StyledWrapper from './StyledWrapper';
const Documentation = ({ item, collection }) => {
const dispatch = useDispatch();
const { storedTheme } = useTheme();
const { displayedTheme } = useTheme();
const [isEditing, setIsEditing] = useState(false);
const docs = item.draft ? get(item, 'draft.request.docs') : get(item, 'request.docs');
const preferences = useSelector((state) => state.app.preferences);
@ -45,7 +45,7 @@ const Documentation = ({ item, collection }) => {
{isEditing ? (
<CodeEditor
collection={collection}
theme={storedTheme}
theme={displayedTheme}
font={get(preferences, 'font.codeFont', 'default')}
value={docs || ''}
onEdit={onEdit}

View File

@ -10,7 +10,7 @@ import StyledWrapper from './StyledWrapper';
const GraphQLVariables = ({ variables, item, collection }) => {
const dispatch = useDispatch();
const { storedTheme } = useTheme();
const { displayedTheme } = useTheme();
const preferences = useSelector((state) => state.app.preferences);
const onEdit = (value) => {
@ -31,7 +31,7 @@ const GraphQLVariables = ({ variables, item, collection }) => {
<CodeEditor
collection={collection}
value={variables || ''}
theme={storedTheme}
theme={displayedTheme}
font={get(preferences, 'font.codeFont', 'default')}
onEdit={onEdit}
mode="javascript"

View File

@ -13,7 +13,7 @@ const RequestBody = ({ item, collection }) => {
const dispatch = useDispatch();
const body = item.draft ? get(item, 'draft.request.body') : get(item, 'request.body');
const bodyMode = item.draft ? get(item, 'draft.request.body.mode') : get(item, 'request.body.mode');
const { storedTheme } = useTheme();
const { displayedTheme } = useTheme();
const preferences = useSelector((state) => state.app.preferences);
const onEdit = (value) => {
@ -48,7 +48,7 @@ const RequestBody = ({ item, collection }) => {
<StyledWrapper className="w-full">
<CodeEditor
collection={collection}
theme={storedTheme}
theme={displayedTheme}
font={get(preferences, 'font.codeFont', 'default')}
value={bodyContent[bodyMode] || ''}
onEdit={onEdit}

View File

@ -12,7 +12,7 @@ const Script = ({ item, collection }) => {
const requestScript = item.draft ? get(item, 'draft.request.script.req') : get(item, 'request.script.req');
const responseScript = item.draft ? get(item, 'draft.request.script.res') : get(item, 'request.script.res');
const { storedTheme } = useTheme();
const { displayedTheme } = useTheme();
const preferences = useSelector((state) => state.app.preferences);
const onRequestScriptEdit = (value) => {
@ -45,7 +45,7 @@ const Script = ({ item, collection }) => {
<CodeEditor
collection={collection}
value={requestScript || ''}
theme={storedTheme}
theme={displayedTheme}
font={get(preferences, 'font.codeFont', 'default')}
onEdit={onRequestScriptEdit}
mode="javascript"
@ -58,7 +58,7 @@ const Script = ({ item, collection }) => {
<CodeEditor
collection={collection}
value={responseScript || ''}
theme={storedTheme}
theme={displayedTheme}
font={get(preferences, 'font.codeFont', 'default')}
onEdit={onResponseScriptEdit}
mode="javascript"

View File

@ -11,7 +11,7 @@ const Tests = ({ item, collection }) => {
const dispatch = useDispatch();
const tests = item.draft ? get(item, 'draft.request.tests') : get(item, 'request.tests');
const { storedTheme } = useTheme();
const { displayedTheme } = useTheme();
const preferences = useSelector((state) => state.app.preferences);
const onEdit = (value) => {
@ -32,7 +32,7 @@ const Tests = ({ item, collection }) => {
<CodeEditor
collection={collection}
value={tests || ''}
theme={storedTheme}
theme={displayedTheme}
font={get(preferences, 'font.codeFont', 'default')}
onEdit={onEdit}
mode="javascript"

View File

@ -19,7 +19,7 @@ const QueryResultPreview = ({
collection,
mode,
disableRunEventListener,
storedTheme
displayedTheme
}) => {
const preferences = useSelector((state) => state.app.preferences);
const dispatch = useDispatch();
@ -71,7 +71,7 @@ const QueryResultPreview = ({
<CodeEditor
collection={collection}
font={get(preferences, 'font.codeFont', 'default')}
theme={storedTheme}
theme={displayedTheme}
onRun={onRun}
value={formattedData}
mode={mode}

View File

@ -51,7 +51,7 @@ const QueryResult = ({ item, collection, data, dataBuffer, width, disableRunEven
const mode = getCodeMirrorModeBasedOnContentType(contentType, data);
const [filter, setFilter] = useState(null);
const formattedData = formatResponse(data, mode, filter);
const { storedTheme } = useTheme();
const { displayedTheme } = useTheme();
const debouncedResultFilterOnChange = debounce((e) => {
setFilter(e.target.value);
@ -132,7 +132,7 @@ const QueryResult = ({ item, collection, data, dataBuffer, width, disableRunEven
collection={collection}
allowedPreviewModes={allowedPreviewModes}
disableRunEventListener={disableRunEventListener}
storedTheme={storedTheme}
displayedTheme={displayedTheme}
/>
{queryFilterEnabled && <QueryResultFilter onChange={debouncedResultFilterOnChange} mode={mode} />}
</>

View File

@ -11,7 +11,7 @@ import { IconCopy } from '@tabler/icons';
import { findCollectionByItemUid } from '../../../../../../../utils/collections/index';
const CodeView = ({ language, item }) => {
const { storedTheme } = useTheme();
const { displayedTheme } = useTheme();
const preferences = useSelector((state) => state.app.preferences);
const { target, client, language: lang } = language;
const requestHeaders = item.draft ? get(item, 'draft.request.headers') : get(item, 'request.headers');
@ -45,7 +45,7 @@ const CodeView = ({ language, item }) => {
readOnly
value={snippet}
font={get(preferences, 'font.codeFont', 'default')}
theme={storedTheme}
theme={displayedTheme}
mode={lang}
/>
</StyledWrapper>