@hyper-fetch/plugin-devtools
Version:
Socket devtool plugin for HyperFetch
308 lines (300 loc) • 12 kB
JavaScript
var __defProp = Object.defineProperty;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
// src/devtools.plugin.ts
import { Plugin } from "@hyper-fetch/core";
// src/devtools.event.handler.ts
import { Socket } from "@hyper-fetch/sockets";
// src/types/events.types.ts
var CoreEvents = /* @__PURE__ */ ((CoreEvents2) => {
CoreEvents2["ON_CACHE_CHANGE"] = "ON_CACHE_CHANGE";
CoreEvents2["ON_CACHE_INVALIDATION"] = "ON_CACHE_INVALIDATION";
CoreEvents2["ON_CACHE_DELETE"] = "ON_CACHE_DELETE";
CoreEvents2["ON_REQUEST_LOADING"] = "ON_REQUEST_LOADING";
CoreEvents2["ON_FETCH_QUEUE_STATUS_CHANGE"] = "ON_FETCH_QUEUE_STATUS_CHANGE";
CoreEvents2["ON_FETCH_QUEUE_CLEAR"] = "ON_FETCH_QUEUE_CLEAR";
CoreEvents2["ON_SUBMIT_QUEUE_STATUS_CHANGE"] = "ON_SUBMIT_QUEUE_STATUS_CHANGE";
CoreEvents2["ON_SUBMIT_QUEUE_CLEAR"] = "ON_SUBMIT_QUEUE_CLEAR";
return CoreEvents2;
})(CoreEvents || {});
var CustomEvents = /* @__PURE__ */ ((CustomEvents2) => {
CustomEvents2["REQUEST_CREATED"] = "REQUEST_CREATED";
return CustomEvents2;
})(CustomEvents || {});
var EventSourceType = /* @__PURE__ */ ((EventSourceType2) => {
EventSourceType2["REQUEST_MANAGER"] = "requestManager";
EventSourceType2["APP_MANAGER"] = "appManager";
EventSourceType2["CACHE"] = "cache";
EventSourceType2["SUBMIT_DISPATCHER"] = "submitDispatcher";
EventSourceType2["FETCH_DISPATCHER"] = "fetchDispatcher";
EventSourceType2["CUSTOM_EVENT"] = "customEvent";
return EventSourceType2;
})(EventSourceType || {});
var InternalEvents = /* @__PURE__ */ ((InternalEvents2) => {
InternalEvents2["PLUGIN_INITIALIZED"] = "PLUGIN_INITIALIZED";
InternalEvents2["PLUGIN_HANGUP"] = "PLUGIN_HANGUP";
InternalEvents2["APP_INITIALIZED"] = "APP_INITIALIZED";
return InternalEvents2;
})(InternalEvents || {});
// src/types/messages.types.ts
var MessageType = /* @__PURE__ */ ((MessageType2) => {
MessageType2["INTERNAL"] = "INTERNAL";
MessageType2["EVENT"] = "EVENT";
return MessageType2;
})(MessageType || {});
var MessageOrigin = /* @__PURE__ */ ((MessageOrigin2) => {
MessageOrigin2["PLUGIN"] = "PLUGIN";
MessageOrigin2["APP"] = "APP";
return MessageOrigin2;
})(MessageOrigin || {});
// src/types/topics.ts
var SocketTopics = /* @__PURE__ */ ((SocketTopics2) => {
SocketTopics2["APP_MAIN_LISTENER"] = "APP_MAIN_LISTENER";
SocketTopics2["APP_MAIN_EMITTER"] = "APP_MAIN_EMITTER";
SocketTopics2["APP_INSTANCE_LISTENER"] = "APP_INSTANCE_LISTENER";
SocketTopics2["APP_INSTANCE_EMITTER"] = "APP_INSTANCE_EMITTER";
SocketTopics2["PLUGIN_LISTENER"] = "PLUGIN_LISTENER";
SocketTopics2["PLUGIN_EMITTER"] = "PLUGIN_EMITTER";
return SocketTopics2;
})(SocketTopics || {});
// src/devtools.event.handler.ts
var DevtoolsEventHandler = class {
constructor(client, { appName, url = "ws://localhost:2137", debug = false, environment }) {
__publicField(this, "client");
__publicField(this, "socket");
// TODO - fix type, it can be either internal or simply an event
__publicField(this, "socketEmitter");
__publicField(this, "socketListener");
__publicField(this, "unmountHooks");
// TODO FIX ANY
__publicField(this, "isConnected");
__publicField(this, "isInitialized");
__publicField(this, "eventQueue", []);
__publicField(this, "connectionName");
__publicField(this, "environment");
__publicField(this, "logger");
__publicField(this, "sendEvent", ({
eventSource,
eventName,
data,
isTriggeredExternally = false
}) => {
if (isTriggeredExternally) {
return;
}
if (this.isConnected && this.isInitialized) {
try {
this.socketEmitter.emit({
payload: {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
messageType: "EVENT" /* EVENT */,
eventSource,
connectionName: this.connectionName,
eventName,
isTriggeredExternally: false,
environment: this.environment,
eventData: data,
origin: "PLUGIN" /* PLUGIN */
}
});
} catch (e) {
console.error("ERROR", e);
}
} else {
this.eventQueue.push({
messageType: "EVENT" /* EVENT */,
eventSource,
connectionName: this.connectionName,
eventName,
isTriggeredExternally: false,
environment: this.environment,
eventData: data,
origin: "PLUGIN" /* PLUGIN */
});
}
});
__publicField(this, "initializeHooks", () => {
this.client.requestManager.emitter.onEmit(
(eventName, data, isTriggeredExternally) => this.sendEvent({ eventSource: "requestManager" /* REQUEST_MANAGER */, eventName, data, isTriggeredExternally })
);
this.client.appManager.emitter.onEmit(
(eventName, data, isTriggeredExternally) => this.sendEvent({ eventSource: "appManager" /* APP_MANAGER */, eventName, data, isTriggeredExternally })
);
this.client.cache.emitter.onEmit(
(eventName, data, isTriggeredExternally) => this.sendEvent({ eventSource: "cache" /* CACHE */, eventName, data, isTriggeredExternally })
);
this.client.fetchDispatcher.emitter.onEmit(
(eventName, data, isTriggeredExternally) => this.sendEvent({ eventSource: "fetchDispatcher" /* FETCH_DISPATCHER */, eventName, data, isTriggeredExternally })
);
this.client.submitDispatcher.emitter.onEmit(
(eventName, data, isTriggeredExternally) => this.sendEvent({ eventSource: "submitDispatcher" /* SUBMIT_DISPATCHER */, eventName, data, isTriggeredExternally })
);
});
this.isConnected = false;
this.isInitialized = false;
this.eventQueue = [];
this.client = client;
this.unmountHooks = this.initializeHooks();
this.connectionName = appName;
this.environment = environment || appName;
this.socket = new Socket({
url,
adapterOptions: { autoConnect: false },
reconnect: 100,
reconnectTime: 3e3
}).setQueryParams({
connectionName: this.connectionName,
origin: "PLUGIN" /* PLUGIN */
});
this.logger = client.loggerManager.initialize(client, "DevtoolsEventHandler");
this.socketEmitter = this.socket.createEmitter()({
topic: "PLUGIN_EMITTER" /* PLUGIN_EMITTER */
});
this.socketListener = this.socket.createListener()({ topic: "PLUGIN_LISTENER" /* PLUGIN_LISTENER */ });
this.socket.connect();
this.socket.onDisconnected(() => {
if (debug) {
this.logger.info({ title: "Disconnected", type: "system", extra: {} });
}
});
this.socket.onError(({ error }) => {
if (debug) {
this.logger.error({ title: "Error", type: "system", extra: { error } });
}
});
this.socket.onConnected(() => {
if (debug) {
this.logger.info({ title: "Connected", type: "system", extra: {} });
}
this.isConnected = true;
this.socketEmitter.emit({
payload: {
messageType: "INTERNAL" /* INTERNAL */,
eventType: "PLUGIN_INITIALIZED" /* PLUGIN_INITIALIZED */,
clientOptions: this.client.options,
adapterOptions: this.client.adapter.options,
environment: this.environment,
connectionName: this.connectionName,
origin: "PLUGIN" /* PLUGIN */
}
});
});
this.socketListener.listen((message) => {
switch (message.data.messageType) {
case "EVENT" /* EVENT */: {
if (message.data.eventSource === "cache" /* CACHE */) {
if (message.data.eventName === "ON_CACHE_CHANGE" /* ON_CACHE_CHANGE */) {
const data = message.data.eventData;
client.cache.storage.set(data.cacheKey, data);
client.cache.events.emitCacheData(data, true);
}
if (message.data.eventName === "ON_CACHE_INVALIDATION" /* ON_CACHE_INVALIDATION */) {
const data = message.data.eventData;
client.cache.events.emitInvalidation(data, true);
}
if (message.data.eventName === "ON_CACHE_DELETE" /* ON_CACHE_DELETE */) {
const data = message.data.eventData;
client.cache.storage.delete(data);
client.cache.events.emitDelete(data, true);
}
}
if (message.data.eventSource === "requestManager" /* REQUEST_MANAGER */) {
if (message.data.eventName === "ON_REQUEST_LOADING" /* ON_REQUEST_LOADING */) {
const data = message.data.eventData;
client.requestManager.events.emitLoading(data, true);
}
}
if (message.data.eventSource === "fetchDispatcher" /* FETCH_DISPATCHER */) {
if (message.data.eventName === "ON_FETCH_QUEUE_STATUS_CHANGE" /* ON_FETCH_QUEUE_STATUS_CHANGE */) {
const data = message.data.eventData;
if (data.stopped) {
client.fetchDispatcher.stop(data.queryKey);
} else {
client.fetchDispatcher.start(data.queryKey);
}
}
if (message.data.eventName === "ON_FETCH_QUEUE_CLEAR" /* ON_FETCH_QUEUE_CLEAR */) {
client.fetchDispatcher.clearQueue(message.data.eventData.queryKey);
}
}
if (message.data.eventSource === "submitDispatcher" /* SUBMIT_DISPATCHER */) {
if (message.data.eventName === "ON_SUBMIT_QUEUE_STATUS_CHANGE" /* ON_SUBMIT_QUEUE_STATUS_CHANGE */) {
const data = message.data.eventData;
if (data.stopped) {
client.submitDispatcher.stop(data.queryKey);
} else {
client.submitDispatcher.start(data.queryKey);
}
}
if (message.data.eventName === "ON_SUBMIT_QUEUE_CLEAR" /* ON_SUBMIT_QUEUE_CLEAR */) {
const data = message.data.eventData;
client.submitDispatcher.clearQueue(data.queryKey);
}
}
break;
}
case "INTERNAL" /* INTERNAL */: {
if (message.data.eventType === "APP_INITIALIZED" /* APP_INITIALIZED */) {
this.isInitialized = true;
while (this.eventQueue.length > 0) {
const nextEvent = this.eventQueue.shift();
if (nextEvent) {
this.socketEmitter.emit({ payload: nextEvent });
}
}
} else {
this.logger.error({
title: `Unknown event type ${message.data.messageType}`,
type: "system",
extra: { message }
});
}
break;
}
default: {
this.logger.error({
title: `Unknown Message Type`,
type: "system",
extra: { message }
});
}
}
});
}
};
// src/devtools.plugin.ts
var DevtoolsPlugin = (options) => {
const plugin = new Plugin({
name: "plugin-devtools",
data: {
eventHandler: void 0,
requests: []
}
});
plugin.onMount(({ client }) => {
plugin.data.eventHandler = new DevtoolsEventHandler(client, options);
});
plugin.onRequestCreate(({ request }) => {
var _a;
plugin.data.requests.push(request);
(_a = plugin.data.eventHandler) == null ? void 0 : _a.sendEvent({
eventSource: "customEvent" /* CUSTOM_EVENT */,
eventName: "REQUEST_CREATED" /* REQUEST_CREATED */,
data: plugin.data.requests,
isTriggeredExternally: false
});
});
return plugin;
};
export {
CoreEvents,
CustomEvents,
DevtoolsPlugin,
EventSourceType,
InternalEvents,
MessageOrigin,
MessageType,
SocketTopics
};
//# sourceMappingURL=index.js.map