diff --git a/frontend/src/components/Editor/Editor.js b/frontend/src/components/Editor/Editor.js index 407d7d603..c55c1d371 100644 --- a/frontend/src/components/Editor/Editor.js +++ b/frontend/src/components/Editor/Editor.js @@ -9,7 +9,7 @@ import { queryIndexerFunctionDetails } from "../../utils/queryIndexerFunction"; import { Alert } from "react-bootstrap"; import primitives from "!!raw-loader!../../../primitives.d.ts"; import { request, useInitialPayload } from "near-social-bridge"; -import Indexer from "../../utils/indexerRunner"; +import IndexerRunner from "../../utils/indexerRunner"; import { block_details } from "./block_details"; import ResizableLayoutEditor from "./ResizableLayoutEditor"; import { ResetChangesModal } from "../Modals/resetChanges"; @@ -17,8 +17,6 @@ import { FileSwitcher } from "./FileSwitcher"; import EditorButtons from "./EditorButtons"; import { PublishModal } from "../Modals/PublishModal"; const BLOCKHEIGHT_LIMIT = 3600; -const BLOCK_FETCHER_API = - "https://70jshyr5cb.execute-api.eu-central-1.amazonaws.com/block/"; const contractRegex = RegExp( "^(([a-zd]+[-_])*[a-zd]+.)*([a-zd]+[-_])*[a-zd]+$" @@ -38,16 +36,17 @@ const Editor = ({ const [originalSQLCode, setOriginalSQLCode] = useState(defaultSchema); const [originalIndexingCode, setOriginalIndexingCode] = useState(defaultCode); const [debugMode, setDebugMode] = useState(false); - const [logs, setLogs] = useState([]); const [heights, setHeights] = useState([]); const [showPublishModal, setShowPublishModal] = useState(false); const [debugModeInfoDisabled, setDebugModeInfoDisabled] = useState(false); - const handleLog = (blockHeight, log) => { - console.log(`Block #${blockHeight}: ${log}`); - setLogs((prevLogs) => [...prevLogs, log]); + const handleLog = (blockHeight, log, callback) => { + if(log) console.log(log); + if (callback) { + callback(); + } }; - const indexerRunner = new Indexer(handleLog); + const indexerRunner = new IndexerRunner(handleLog); const [indexingCode, setIndexingCode] = useState(defaultCode); const [schema, setSchema] = useState(defaultSchema); @@ -272,7 +271,6 @@ const Editor = ({ const modifiedEditor = editor.getModifiedEditor(); modifiedEditor.onDidChangeModelContent((_) => { if (fileName == "indexingLogic.js") { - console.log("mountin"); setIndexingCode(modifiedEditor.getValue()); } if (fileName == "schema.sql") { @@ -303,28 +301,8 @@ const Editor = ({ } } - async function fetchBlockDetails(blockHeight) { - try { - const response = await fetch( - `${BLOCK_FETCHER_API}${String(blockHeight)}` - ); - const block_details = await response.json(); - return block_details; - } catch { - console.log(`Error Fetching Block Height details at ${blockHeight}`); - } - } - async function executeIndexerFunction() { - setLogs(() => []); - let innerCode = indexingCode.match(/getBlock\s*\([^)]*\)\s*{([\s\S]*)}/)[1]; - // for loop with await - for await (const height of heights) { - const block_details = await fetchBlockDetails(height); - if (block_details) { - await indexerRunner.runFunction(block_details, height, innerCode); - } - } + await indexerRunner.executeIndexerFunction(heights,indexingCode) } return ( @@ -431,7 +409,6 @@ const Editor = ({ options={options} handleEditorWillMount={handleEditorWillMount} handleEditorMount={handleEditorMount} - logs={logs} /> diff --git a/frontend/src/components/Editor/ResizableLayoutEditor.jsx b/frontend/src/components/Editor/ResizableLayoutEditor.jsx index 0b8e20d1c..667ad610e 100644 --- a/frontend/src/components/Editor/ResizableLayoutEditor.jsx +++ b/frontend/src/components/Editor/ResizableLayoutEditor.jsx @@ -139,7 +139,6 @@ export default function ResizableLayoutEditor({ options, handleEditorWillMount, handleEditorMount, - logs, }) { const { dragBarRef: dragBarRefConsole, diff --git a/frontend/src/components/Playground/graphiql.jsx b/frontend/src/components/Playground/graphiql.jsx index 3afa68d17..482edd7d3 100644 --- a/frontend/src/components/Playground/graphiql.jsx +++ b/frontend/src/components/Playground/graphiql.jsx @@ -7,7 +7,6 @@ const HASURA_ENDPOINT = "https://queryapi-hasura-graphql-24ktefolwq-ew.a.run.app/v1/graphql"; const graphQLFetcher = async (graphQLParams, accountId) => { - console.log(HASURA_ENDPOINT, "Hashura Endpoint"); const response = await fetch(HASURA_ENDPOINT, { method: "post", credentials: "omit", diff --git a/frontend/src/utils/fetchBlock.js b/frontend/src/utils/fetchBlock.js new file mode 100644 index 000000000..f773c109a --- /dev/null +++ b/frontend/src/utils/fetchBlock.js @@ -0,0 +1,14 @@ +const BLOCK_FETCHER_API = + "https://70jshyr5cb.execute-api.eu-central-1.amazonaws.com/block/"; + +export async function fetchBlockDetails(blockHeight) { + try { + const response = await fetch( + `${BLOCK_FETCHER_API}${String(blockHeight)}` + ); + const block_details = await response.json(); + return block_details; + } catch { + console.log(`Error Fetching Block Height details at ${blockHeight}`); + } + } diff --git a/frontend/src/utils/indexerRunner.js b/frontend/src/utils/indexerRunner.js index 05afb3e59..4007d56f5 100644 --- a/frontend/src/utils/indexerRunner.js +++ b/frontend/src/utils/indexerRunner.js @@ -1,10 +1,35 @@ import { Block } from "@near-lake/primitives"; import { Buffer } from "buffer"; +import {fetchBlockDetails} from "./fetchBlock"; + global.Buffer = Buffer; -export default class Indexer { +export default class IndexerRunner { constructor(handleLog) { this.handleLog = handleLog; } + + async executeIndexerFunction(heights, indexingCode) { + console.clear() + console.group('%c Welcome! Lets test your indexing logic on some Near Blocks!', 'color: white; background-color: navy; padding: 5px;'); + if(heights.length === 0) { + console.warn("No Block Heights Selected") + } + console.log("Note: GraphQL Mutations & Queries will not be executed on your database. They will simply return an empty object. Please keep this in mind as this may cause unintended behavior of your indexer function.") + let innerCode = indexingCode.match(/getBlock\s*\([^)]*\)\s*{([\s\S]*)}/)[1]; + // for loop with await + for await (const height of heights) { + console.group(`Block Height #${height}`) + const block_details = await fetchBlockDetails(height); + console.time('Indexing Execution Complete') + if (block_details) { + await this.runFunction(block_details, height, innerCode); + } + console.timeEnd('Indexing Execution Complete') + console.groupEnd() + } + console.groupEnd() + } + async runFunction(streamerMessage, blockHeight, indexerCode) { const innerCodeWithBlockHelper = ` @@ -25,21 +50,40 @@ export default class Indexer { // Define the custom context object const context = { - set: async () => { + set: async (key, value) => { this.handleLog( blockHeight, - "Context.set() is not supported in debug mode." + "", + () => { + console.group(`Setting Key/Value`); + console.log({key: value}); + console.groupEnd(); + } ); return {}; }, graphql: async (query, mutationData) => { this.handleLog( blockHeight, - "Context.graphql() is not supported in debug mode." - ); - this.handleLog( - blockHeight, - `mutationData: ${JSON.stringify(mutationData)}` + "", + () => { + let operationType, operationName + const match = query.match(/(query|mutation)\s+(\w+)\s*(\(.*?\))?\s*\{([\s\S]*)\}/); + if (match) { + operationType = match[1]; + operationName = match[2]; + } + + console.group(`Executing GraphQL ${operationType}: (${operationName})`); + if (operationType === 'mutation') console.log('%c Mutations in debug mode do not alter the database', 'color: black; background-color: yellow; padding: 5px;'); + console.group(`Data passed to ${operationType}`); + console.dir(mutationData); + console.groupEnd(); + console.group(`Data returned by ${operationType}`); + console.log({}) + console.groupEnd(); + console.groupEnd(); + } ); return {}; },