Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[editor][client] helper util to generate a session id #898

Closed
wants to merge 2 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions python/src/aiconfig/editor/client/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@
]
},
"dependencies": {
"@datadog/browser-logs": "^5.6.0",
"@emotion/react": "^11.11.1",
"@mantine/carousel": "^6.0.7",
"@mantine/core": "^6.0.7",
Expand All @@ -35,6 +36,7 @@
"@mantine/prism": "^6.0.7",
"@monaco-editor/react": "^4.6.0",
"@tabler/icons-react": "^2.44.0",
"@types/uuid": "^9.0.7",
"aiconfig": "../../../../../typescript",
"lodash": "^4.17.21",
"node-fetch": "^3.3.2",
Expand Down
12 changes: 12 additions & 0 deletions python/src/aiconfig/editor/client/src/LocalEditor.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,8 @@ import { useCallback, useEffect, useMemo, useState } from "react";
import { ufetch } from "ufetch";
import { ROUTE_TABLE } from "./utils/api";
import { streamingApiChain } from "./utils/oboeHelpers";
import { datadogLogs } from "@datadog/browser-logs";
import { LogEvent, LogEventData } from "./shared/types";

export default function Editor() {
const [aiconfig, setAiConfig] = useState<AIConfig | undefined>();
Expand Down Expand Up @@ -174,6 +176,14 @@ export default function Editor() {
return await ufetch.get(ROUTE_TABLE.SERVER_STATUS);
}, []);

const logEvent = useCallback((event: LogEvent, data?: LogEventData) => {
try {
datadogLogs.logger.info(event, data);
} catch (e) {
// Ignore logger errors for now
}
}, []);

const callbacks: AIConfigCallbacks = useMemo(
() => ({
addPrompt,
Expand All @@ -182,6 +192,7 @@ export default function Editor() {
deletePrompt,
getModels,
getServerStatus,
logEvent,
runPrompt,
save,
setConfigDescription,
Expand All @@ -197,6 +208,7 @@ export default function Editor() {
deletePrompt,
getModels,
getServerStatus,
logEvent,
runPrompt,
save,
setConfigDescription,
Expand Down
Original file line number Diff line number Diff line change
@@ -1,12 +1,13 @@
import { createContext } from "react";
import { ClientAIConfig } from "../shared/types";
import { ClientAIConfig, LogEvent, LogEventData } from "../shared/types";

/**
* Context for overall editor config state. This context should
* be memoized to prevent unnecessary re-renders
*/
const AIConfigContext = createContext<{
getState: () => ClientAIConfig;
logEvent?: (event: LogEvent, data?: LogEventData) => void;
}>({
getState: () => ({ prompts: [], _ui: { isDirty: false } }),
});
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,8 @@ import { v4 as uuidv4 } from "uuid";
import aiconfigReducer, { AIConfigReducerAction } from "./aiconfigReducer";
import {
ClientPrompt,
LogEvent,
LogEventData,
aiConfigToClientConfig,
clientConfigToAIConfig,
clientPromptToAIConfigPrompt,
Expand Down Expand Up @@ -102,6 +104,7 @@ export type AIConfigCallbacks = {
deletePrompt: (promptName: string) => Promise<void>;
getModels: (search: string) => Promise<string[]>;
getServerStatus?: () => Promise<{ status: "OK" | "ERROR" }>;
logEvent?: (event: LogEvent, data?: LogEventData) => void;
runPrompt: (
promptName: string,
onStream: RunPromptStreamCallback,
Expand Down Expand Up @@ -171,6 +174,8 @@ export default function EditorContainer({
const stateRef = useRef(aiconfigState);
stateRef.current = aiconfigState;

const logEvent = callbacks.logEvent;

const saveCallback = callbacks.save;
const onSave = useCallback(async () => {
setIsSaving(true);
Expand Down Expand Up @@ -519,6 +524,7 @@ export default function EditorContainer({
};

dispatch(action);
logEvent?.("ADD_PROMPT", { model, promptIndex });

try {
const serverConfigRes = await addPromptCallback(
Expand All @@ -540,7 +546,7 @@ export default function EditorContainer({
});
}
},
[addPromptCallback, dispatch]
[addPromptCallback, logEvent]
);

const deletePromptCallback = callbacks.deletePrompt;
Expand Down Expand Up @@ -771,8 +777,9 @@ export default function EditorContainer({
const contextValue = useMemo(
() => ({
getState,
logEvent,
}),
[getState]
[getState, logEvent]
);

const isDirty = aiconfigState._ui.isDirty !== false;
Expand Down Expand Up @@ -878,7 +885,10 @@ export default function EditorContainer({
<Button
leftIcon={<IconDeviceFloppy />}
loading={isSaving}
onClick={onSave}
onClick={() => {
onSave();
logEvent?.("SAVE_BUTTON_CLICKED");
}}
disabled={!isDirty}
size="xs"
variant="gradient"
Expand Down
11 changes: 11 additions & 0 deletions python/src/aiconfig/editor/client/src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,17 @@ import React from "react";
import ReactDOM from "react-dom/client";
import LocalEditor from "./LocalEditor";

import { datadogLogs } from "@datadog/browser-logs";

datadogLogs.init({
clientToken: "pub356987caf022337989e492681d1944a8",
env: process.env.NODE_ENV ?? "development",
service: "aiconfig-editor",
site: "us5.datadoghq.com",
forwardErrorsToLogs: true,
sessionSampleRate: 100,
});

const root = ReactDOM.createRoot(
document.getElementById("root") as HTMLElement
);
Expand Down
5 changes: 4 additions & 1 deletion python/src/aiconfig/editor/client/src/shared/types.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { AIConfig, Prompt } from "aiconfig";
import { AIConfig, JSONObject, Prompt } from "aiconfig";
import { uniqueId } from "lodash";

export type EditorFile = {
Expand Down Expand Up @@ -61,3 +61,6 @@ export function aiConfigToClientConfig(aiconfig: AIConfig): ClientAIConfig {
},
};
}

export type LogEvent = "ADD_PROMPT" | "SAVE_BUTTON_CLICKED";
export type LogEventData = JSONObject;
6 changes: 6 additions & 0 deletions python/src/aiconfig/editor/client/src/utils/logging.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
import * as uuid from "uuid";


function generateUniqueSessionId(): string {
return uuid.v4();
}
12 changes: 12 additions & 0 deletions python/src/aiconfig/editor/client/yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -1289,6 +1289,18 @@
enabled "2.0.x"
kuler "^2.0.0"

"@datadog/[email protected]":
version "5.6.0"
resolved "https://registry.yarnpkg.com/@datadog/browser-core/-/browser-core-5.6.0.tgz#f7a0d809afede4520bb4786886b4648c0e1b890d"
integrity sha512-z6CvlJyEFbYNw2ZawY9fDHQjdl71yp0OcchvB/S4SGKdQVLPUd48Y528gv132VDnY2g0UipE9JK59wnAamyS9w==

"@datadog/browser-logs@^5.6.0":
version "5.6.0"
resolved "https://registry.yarnpkg.com/@datadog/browser-logs/-/browser-logs-5.6.0.tgz#2b4b62d87a315560e87d46f84504012f7b7bdecd"
integrity sha512-NyqkG+UfAgz86CbEbSrAlDR5GvjJHAUwaI38xo9JR+9O5KJkwMgRnvQBtmdmpjjm723yyWeDcTd+ZIdvgIP61g==
dependencies:
"@datadog/browser-core" "5.6.0"

"@emotion/babel-plugin@^11.11.0":
version "11.11.0"
resolved "https://registry.yarnpkg.com/@emotion/babel-plugin/-/babel-plugin-11.11.0.tgz#c2d872b6a7767a9d176d007f5b31f7d504bb5d6c"
Expand Down