+ setOpenTooltip(false)}>
+
Point JSON copied to clipboard.
diff --git a/src/components/VisualizeChart/index.jsx b/src/components/VisualizeChart/index.jsx
index 93f0bf6c..bb8c7da4 100644
--- a/src/components/VisualizeChart/index.jsx
+++ b/src/components/VisualizeChart/index.jsx
@@ -1,29 +1,25 @@
-import React, { useEffect, useState } from "react";
-import PropTypes from "prop-types";
-import Chart from "chart.js/auto";
-import { useSnackbar } from "notistack";
-import {
- Button,
-} from "@mui/material";
-import ViewPointModal from "./ViewPointModal";
-
-
+import React, { useEffect, useState } from 'react';
+import PropTypes from 'prop-types';
+import Chart from 'chart.js/auto';
+import { useSnackbar } from 'notistack';
+import { Button } from '@mui/material';
+import ViewPointModal from './ViewPointModal';
const VisualizeChart = ({ scrollResult }) => {
- const { enqueueSnackbar ,closeSnackbar} = useSnackbar();
+ const { enqueueSnackbar, closeSnackbar } = useSnackbar();
const [openViewPoints, setOpenViewPoints] = useState(false);
const [viewPoints, setViewPoint] = useState([]);
const action = (snackbarId) => (
-
- );
+
+ );
useEffect(() => {
if (!scrollResult.data && !scrollResult.error) {
@@ -31,39 +27,32 @@ const VisualizeChart = ({ scrollResult }) => {
}
if (scrollResult.error) {
- enqueueSnackbar(
- `Visualization Unsuccessful, error: ${JSON.stringify(
- scrollResult.error
- )}`,
- { variant: "error", action }
- );
+ enqueueSnackbar(`Visualization Unsuccessful, error: ${JSON.stringify(scrollResult.error)}`, {
+ variant: 'error',
+ action,
+ });
return;
- }
- else if (!scrollResult.data?.result?.points.length) {
+ } else if (!scrollResult.data?.result?.points.length) {
enqueueSnackbar(`Visualization Unsuccessful, error: No data returned`, {
- variant: "error",
+ variant: 'error',
action,
});
return;
}
- let dataset = [];
- let labelby = scrollResult.data.color_by;
+ const dataset = [];
+ const labelby = scrollResult.data.color_by;
if (labelby) {
- if(scrollResult.data.result?.points[0]?.payload[labelby] === undefined){
- enqueueSnackbar(
- `Visualization Unsuccessful, error: Color by field ${labelby} does not exist`,
- { variant: "error", action }
- );
+ if (scrollResult.data.result?.points[0]?.payload[labelby] === undefined) {
+ enqueueSnackbar(`Visualization Unsuccessful, error: Color by field ${labelby} does not exist`, {
+ variant: 'error',
+ action,
+ });
return;
}
scrollResult.data.labelByArrayUnique = [
- ...new Set(
- scrollResult.data.result?.points?.map(
- (point) => point.payload[labelby]
- )
- ),
+ ...new Set(scrollResult.data.result?.points?.map((point) => point.payload[labelby])),
];
scrollResult.data.labelByArrayUnique.forEach((label) => {
dataset.push({
@@ -73,13 +62,13 @@ const VisualizeChart = ({ scrollResult }) => {
});
} else {
dataset.push({
- label: "Data",
+ label: 'Data',
data: [],
});
}
- const ctx = document.getElementById("myChart");
+ const ctx = document.getElementById('myChart');
const myChart = new Chart(ctx, {
- type: "scatter",
+ type: 'scatter',
data: {
datasets: dataset,
},
@@ -101,11 +90,7 @@ const VisualizeChart = ({ scrollResult }) => {
tooltip: {
callbacks: {
label: function (context) {
- return JSON.stringify(
- context.dataset.data[context.dataIndex].point.payload,
- null,
- 2
- ).split("\n");
+ return JSON.stringify(context.dataset.data[context.dataIndex].point.payload, null, 2).split('\n');
},
},
},
@@ -116,12 +101,12 @@ const VisualizeChart = ({ scrollResult }) => {
},
plugins: [
{
- id: "myEventCatcher",
+ id: 'myEventCatcher',
beforeEvent(chart, args) {
const event = args.event;
- if (event.type === "click") {
+ if (event.type === 'click') {
if (chart.tooltip._active.length > 0) {
- let activePoints = chart.tooltip._active.map((point) => {
+ const activePoints = chart.tooltip._active.map((point) => {
return {
id: point.element.$context.raw.point.id,
payload: point.element.$context.raw.point.payload,
@@ -137,31 +122,25 @@ const VisualizeChart = ({ scrollResult }) => {
],
});
- const worker = new Worker(new URL("./worker.js", import.meta.url), {
- type: "module",
+ const worker = new Worker(new URL('./worker.js', import.meta.url), {
+ type: 'module',
});
worker.onmessage = (m) => {
- if(m.data.error){
- enqueueSnackbar(
- `Visualization Unsuccessful, error: ${
- m.data.error
- }`,
- { variant: "error", action }
- );
+ if (m.data.error) {
+ enqueueSnackbar(`Visualization Unsuccessful, error: ${m.data.error}`, {
+ variant: 'error',
+ action,
+ });
return;
- }else if(m.data.result && m.data.result.length > 0){
+ } else if (m.data.result && m.data.result.length > 0) {
m.data.result.forEach((dataset, index) => {
myChart.data.datasets[index].data = dataset.data;
});
myChart.update();
- }else{
- enqueueSnackbar(
- `Visualization Unsuccessful, error: Unexpected Error Occured`,
- { variant: "error", action }
- );
+ } else {
+ enqueueSnackbar(`Visualization Unsuccessful, error: Unexpected Error Occured`, { variant: 'error', action });
}
-
};
if (scrollResult.data.result?.points?.length > 0) {
@@ -176,7 +155,7 @@ const VisualizeChart = ({ scrollResult }) => {
return (
<>
-
+
);
diff --git a/src/components/VisualizeChart/worker.js b/src/components/VisualizeChart/worker.js
index ef0d0abb..42ebed03 100644
--- a/src/components/VisualizeChart/worker.js
+++ b/src/components/VisualizeChart/worker.js
@@ -1,44 +1,40 @@
/* eslint-disable no-restricted-globals */
-import * as druid from "@saehrimnir/druidjs";
+import * as druid from '@saehrimnir/druidjs';
const MESSAGE_INTERVAL = 200;
self.onmessage = function (e) {
let now = new Date().getTime();
- let data1 = e.data;
- let data = [];
+ const data1 = e.data;
+ const data = [];
if (data1?.result?.points?.length === 0) {
self.postMessage({
data: [],
- error: "No data found",
+ error: 'No data found',
});
return;
- }
- else if (data1?.result?.points?.length === 1) {
+ } else if (data1?.result?.points?.length === 1) {
self.postMessage({
data: [],
- error: "cannot perform tsne on single point",
+ error: 'cannot perform tsne on single point',
});
return;
- }
- else if (typeof data1?.result?.points[0].vector.length === "number") {
+ } else if (typeof data1?.result?.points[0].vector.length === 'number') {
data1?.result?.points?.forEach((point) => {
data.push(point.vector);
});
- }else if (typeof data1?.result?.points[0].vector === "object") {
+ } else if (typeof data1?.result?.points[0].vector === 'object') {
if (data1.vector_name === undefined) {
self.postMessage({
data: [],
- error: "No vector name found, select a vaild vector_name",
+ error: 'No vector name found, select a vaild vector_name',
});
return;
- } else if (
- data1?.result?.points[0].vector[data1?.vector_name] === undefined
- ) {
+ } else if (data1?.result?.points[0].vector[data1?.vector_name] === undefined) {
self.postMessage({
data: [],
- error: "No vector found with name " + data1?.vector_name,
+ error: 'No vector found with name ' + data1?.vector_name,
});
return;
} else if (data1?.result?.points[0].vector[data1?.vector_name]) {
@@ -48,20 +44,20 @@ self.onmessage = function (e) {
} else {
self.postMessage({
data: [],
- error: "Unexpected Error Occured",
+ error: 'Unexpected Error Occured',
});
return;
}
- } else {
+ } else {
self.postMessage({
data: [],
- error: "Unexpected Error Occured",
+ error: 'Unexpected Error Occured',
});
return;
}
if (data.length) {
- const D = new druid["TSNE"](data, {}); // ex params = { perplexity : 50,epsilon :5}
- let next = D.generator(); //default = 500 iterations
+ const D = new druid['TSNE'](data, {}); // ex params = { perplexity : 50,epsilon :5}
+ const next = D.generator(); // default = 500 iterations
let i = {};
for (i of next) {
if (Date.now() - now > MESSAGE_INTERVAL) {
@@ -75,8 +71,8 @@ self.onmessage = function (e) {
};
function getDataset(data, reducedPoint) {
- let dataset = [];
- let labelby = data.color_by;
+ const dataset = [];
+ const labelby = data.color_by;
if (labelby) {
data.labelByArrayUnique.forEach((label) => {
dataset.push({
@@ -86,7 +82,7 @@ function getDataset(data, reducedPoint) {
});
data.result?.points?.forEach((point, index) => {
- let label = point.payload[labelby];
+ const label = point.payload[labelby];
dataset[data.labelByArrayUnique.indexOf(label)].data.push({
x: reducedPoint[index][0],
y: reducedPoint[index][1],
@@ -95,7 +91,7 @@ function getDataset(data, reducedPoint) {
});
} else {
dataset.push({
- label: "data",
+ label: 'data',
data: [],
});
data.result?.points?.forEach((point, index) => {
diff --git a/src/components/authDialog/authDialog.jsx b/src/components/authDialog/authDialog.jsx
index 6c026111..eefbff1d 100644
--- a/src/components/authDialog/authDialog.jsx
+++ b/src/components/authDialog/authDialog.jsx
@@ -1,4 +1,5 @@
-import * as React from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
import Button from '@mui/material/Button';
import TextField from '@mui/material/TextField';
import Dialog from '@mui/material/Dialog';
@@ -13,65 +14,69 @@ import VisibilityOff from '@mui/icons-material/VisibilityOff';
import { useClient } from '../../context/client-context';
export function ApiKeyDialog({ open, setOpen, onApply }) {
- const { settings, setSettings } = useClient();
- const [showApiKey, setShowApiKey] = React.useState(false);
+ const { settings, setSettings } = useClient();
+ const [showApiKey, setShowApiKey] = React.useState(false);
- const handleClickShowApiKey = () => setShowApiKey((show) => !show);
+ const handleClickShowApiKey = () => setShowApiKey((show) => !show);
+ const handleMouseDown = (event) => {
+ event.preventDefault();
+ };
- const handleMouseDown = (event) => {
- event.preventDefault();
- };
+ const [apiKey, setApiKey] = React.useState('');
+ const handleClose = () => {
+ setOpen(false);
+ };
- const [apiKey, setApiKey] = React.useState("");
+ const handleApply = () => {
+ setSettings({ ...settings, apiKey });
+ setOpen(false);
+ onApply();
+ };
- const handleClose = () => {
- setOpen(false);
- };
-
- const handleApply = () => {
- setSettings({ ...settings, apiKey });
- setOpen(false);
- onApply();
- };
-
- return (
-
-
-
- );
+ return (
+
+
+
+ );
}
+
+ApiKeyDialog.propTypes = {
+ open: PropTypes.bool.isRequired,
+ setOpen: PropTypes.func.isRequired,
+ onApply: PropTypes.func.isRequired,
+};
diff --git a/src/context/client-context.jsx b/src/context/client-context.jsx
index 5bc78b1a..21489b41 100644
--- a/src/context/client-context.jsx
+++ b/src/context/client-context.jsx
@@ -1,45 +1,42 @@
-import React, { useContext, createContext, useState, useEffect } from "react";
-import setupAxios from "../common/axios";
-import qdrantClient from "../common/client";
+import React, { useContext, createContext, useState, useEffect } from 'react';
+import setupAxios from '../common/axios';
+import qdrantClient from '../common/client';
const DEFAULT_SETTINGS = {
- apiKey: "",
+ apiKey: '',
};
-//Write settings to local storage
+// Write settings to local storage
const persistSettings = (settings) => {
- localStorage.setItem("settings", JSON.stringify(settings));
+ localStorage.setItem('settings', JSON.stringify(settings));
};
// Get existing Settings from Local Storage or set default values
const getPersistedSettings = () => {
- const settings = localStorage.getItem("settings");
+ const settings = localStorage.getItem('settings');
if (settings) return JSON.parse(settings);
return DEFAULT_SETTINGS;
};
-//React context to store the settings
+// React context to store the settings
const ClientContext = createContext();
-//React hook to access and modify the settings
+// React hook to access and modify the settings
export const useClient = () => useContext(ClientContext);
-//Client Context Provider
+// Client Context Provider
export const ClientProvider = (props) => {
- //TODO: Switch to Reducer if we have more settings to track.
+ // TODO: Switch to Reducer if we have more settings to track.
const [settings, setSettings] = useState(getPersistedSettings());
-
- let client = qdrantClient(settings);
+
+ const client = qdrantClient(settings);
useEffect(() => {
setupAxios(settings);
persistSettings(settings);
}, [settings]);
- return (
-
- );
+ return ;
};
-
diff --git a/src/context/color-context.jsx b/src/context/color-context.jsx
index 7247983e..b47124e5 100644
--- a/src/context/color-context.jsx
+++ b/src/context/color-context.jsx
@@ -1,3 +1,5 @@
-import React from "react";
+import React from 'react';
-export const ColorModeContext = React.createContext({ toggleColorMode: () => { } });
\ No newline at end of file
+export const ColorModeContext = React.createContext({
+ toggleColorMode: () => {},
+});
diff --git a/src/hooks/windowHooks.js b/src/hooks/windowHooks.js
index fa6bddd8..6de0c809 100644
--- a/src/hooks/windowHooks.js
+++ b/src/hooks/windowHooks.js
@@ -1,4 +1,4 @@
-import {useEffect, useState} from 'react';
+import { useEffect, useState } from 'react';
export const useWindowResize = () => {
const [resized, setResized] = useState(false);
@@ -11,7 +11,7 @@ export const useWindowResize = () => {
};
});
- return {width: window.innerWidth, height: window.innerHeight}
+ return { width: window.innerWidth, height: window.innerHeight };
};
// add more window hooks here as needed
diff --git a/src/index.css b/src/index.css
index 00183895..53b4a7b9 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,8 +1,7 @@
body {
margin: 0;
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
- "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
- sans-serif;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans',
+ 'Droid Sans', 'Helvetica Neue', sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
diff --git a/src/index.jsx b/src/index.jsx
index 503393af..e0460bc3 100644
--- a/src/index.jsx
+++ b/src/index.jsx
@@ -1,14 +1,13 @@
-import React from "react";
-import ReactDOM from "react-dom/client";
-import "./index.css";
-import App from "./App";
-import reportWebVitals from "./reportWebVitals";
-import { HashRouter } from "react-router-dom";
-import { ClientProvider } from "./context/client-context";
-import { SnackbarProvider } from "notistack";
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import './index.css';
+import App from './App';
+import reportWebVitals from './reportWebVitals';
+import { HashRouter } from 'react-router-dom';
+import { ClientProvider } from './context/client-context';
+import { SnackbarProvider } from 'notistack';
-
-const root = ReactDOM.createRoot(document.getElementById("root"));
+const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
diff --git a/src/pages/Collection.jsx b/src/pages/Collection.jsx
index ee0eccc6..e92cfd57 100644
--- a/src/pages/Collection.jsx
+++ b/src/pages/Collection.jsx
@@ -1,13 +1,13 @@
-import React, { useState } from "react";
-import { Link, useLocation, useNavigate, useParams } from "react-router-dom";
-import { useClient } from "../context/client-context";
-import { Typography, Grid, Button, Tabs, Tab } from "@mui/material";
-import PointCard from "../components/Points/PointCard";
-import ErrorNotifier from "../components/ToastNotifications/ErrorNotifier";
-import SimilarSerachfield from "../components/Points/SimilarSerachfield";
-import { CenteredFrame } from "../components/Common/CenteredFrame";
-import Box from "@mui/material/Box";
-import { SnapshotsTab } from "../components/Snapshots/SnapshotsTab";
+import React, { useState } from 'react';
+import { Link, useLocation, useNavigate, useParams } from 'react-router-dom';
+import { useClient } from '../context/client-context';
+import { Typography, Grid, Button, Tabs, Tab } from '@mui/material';
+import PointCard from '../components/Points/PointCard';
+import ErrorNotifier from '../components/ToastNotifications/ErrorNotifier';
+import SimilarSerachfield from '../components/Points/SimilarSerachfield';
+import { CenteredFrame } from '../components/Common/CenteredFrame';
+import Box from '@mui/material/Box';
+import { SnapshotsTab } from '../components/Snapshots/SnapshotsTab';
function Collection() {
const pageSize = 10;
@@ -46,7 +46,7 @@ function Collection() {
const getPoints = async () => {
if (recommendationIds.length !== 0) {
try {
- let newPoints = await qdrantClient.recommend(collectionName, {
+ const newPoints = await qdrantClient.recommend(collectionName, {
positive: recommendationIds,
limit: pageSize + (offset || 0),
with_payload: true,
@@ -61,19 +61,15 @@ function Collection() {
setPoints({});
}
} else {
-
try {
- let newPoints = await qdrantClient.scroll(collectionName, {
+ const newPoints = await qdrantClient.scroll(collectionName, {
offset,
limit: pageSize,
with_vector: true,
with_payload: true,
});
setPoints({
- points: [
- ...points?.points || [],
- ...newPoints?.points || [],
- ],
+ points: [...(points?.points || []), ...(newPoints?.points || [])],
});
setNextPageOffset(newPoints?.next_page_offset);
setErrorMessage(null);
@@ -89,10 +85,8 @@ function Collection() {
return (
<>
- {errorMessage !== null && (
-
- )}
-
+ {errorMessage !== null && }
+
{collectionName}
@@ -102,49 +96,40 @@ function Collection() {
-
+