change shared path + credits viewable in blocks + refactored api bloc…

…k settings

packages/shared/src/types/NodeTypes.ts

@@ -36,7 +36,7 @@ export type AllDataTypes =
 export type CustomNode = Node<AllDataTypes>;
 export type InputNode = Node<AllDataTypes>;
 
-type OpenAIAPIRequest = {
+export type OpenAIAPIRequest = {
   model: string;
   temperature: number;
   top_p: number;

packages/web/api/getWorkflows.ts

@@ -1,4 +1,4 @@
-import { Database } from '@chatbutler/shared';
+import { Database } from '@chatbutler/shared/src/index';
 import { createClient } from '@supabase/supabase-js';
 import type { VercelRequest, VercelResponse } from '@vercel/node';
 

packages/web/src/auth/supabaseClient.ts

@@ -1,5 +1,5 @@
 // src/supabaseClient.js
-import { Database } from '@chatbutler/shared';
+import { Database } from '@chatbutler/shared/src/index';
 import { createClient } from '@supabase/supabase-js';
 import { useMemo } from 'react';
 

packages/web/src/windows/SettingsPanel/nodeSettings/searchNode/tabs/ApiTab.tsx → packages/web/src/components/ApiTab.tsx

@@ -1,8 +1,8 @@
 import { Node } from 'reactflow';
 
-import { chatModels } from '../../../../../openai/models';
-import ChipsInput from '../../../../ChatPanel/inputs/ChipsInput';
-import RangeInput from '../../../../ChatPanel/inputs/RangeInput';
+import { chatModels } from '../openai/models';
+import ChipsInput from '../windows/ChatPanel/inputs/ChipsInput';
+import RangeInput from '../windows/ChatPanel/inputs/RangeInput';
 
 export default function ApiPromptTab({
 	selectedNode,

packages/web/src/components/DocumentSelector.tsx

@@ -1,4 +1,4 @@
-import { SearchDataType } from '@chatbutler/shared';
+import { SearchDataType } from '@chatbutler/shared/src/index';
 import { Dialog, Transition } from '@headlessui/react';
 import { CheckIcon } from '@heroicons/react/24/outline';
 import { Fragment, useEffect, useRef, useState } from 'react';

packages/web/src/components/RunFromStart.tsx

@@ -1,4 +1,4 @@
-import { CustomNode, NodeTypesEnum, LoopDataType } from '@chatbutler/shared';
+import { CustomNode, NodeTypesEnum, LoopDataType } from '@chatbutler/shared/src/index';
 import { ChevronDoubleRightIcon } from '@heroicons/react/20/solid';
 import { shallow } from 'zustand/shallow';
 

packages/web/src/db/populateUserDocuments.ts

@@ -1,4 +1,4 @@
-import { Database } from '@chatbutler/shared';
+import { Database } from '@chatbutler/shared/src/index';
 import { SupabaseClient } from '@supabase/supabase-js';
 
 import { RFState } from '../store/useStore';

packages/web/src/db/populateUserWorkflows.ts

@@ -1,4 +1,4 @@
-import { Database } from '@chatbutler/shared';
+import { Database } from '@chatbutler/shared/src/index';
 import { SupabaseClient } from '@supabase/supabase-js';
 
 import { RFState } from '../store/useStore';

packages/web/src/db/selectWorkflow.ts

@@ -1,4 +1,4 @@
-import { CustomNode, Database, WorkflowDbSchema } from '@chatbutler/shared';
+import { CustomNode, Database, WorkflowDbSchema } from '@chatbutler/shared/src/index';
 import { SupabaseClient } from '@supabase/supabase-js';
 import { Edge, Node } from 'reactflow';
 

packages/web/src/db/syncToSupabase.ts

@@ -1,4 +1,4 @@
-import { Database } from '@chatbutler/shared';
+import { Database } from '@chatbutler/shared/src/index';
 import { SupabaseClient } from '@supabase/supabase-js';
 import { DefaultParams } from 'wouter';
 

packages/web/src/nodes/ChatMessageNode.tsx

@@ -1,4 +1,4 @@
-import { ChatMessageNodeDataType } from '@chatbutler/shared';
+import { ChatMessageNodeDataType } from '@chatbutler/shared/src/index';
 import { memo, FC, useState } from 'react';
 import { Handle, Position, NodeProps } from 'reactflow';
 import useUndo from 'use-undo';

packages/web/src/nodes/ChatPromptNode.tsx

@@ -1,4 +1,4 @@
-import { ChatPromptNodeDataType } from '@chatbutler/shared';
+import { ChatPromptNodeDataType } from '@chatbutler/shared/src/index';
 import { SignalIcon, ClipboardIcon } from '@heroicons/react/20/solid';
 import { memo, FC, useState } from 'react';
 import { Handle, Position, NodeProps } from 'reactflow';

packages/web/src/nodes/ClassifyCategoriesNode.tsx

@@ -1,4 +1,4 @@
-import { ClassifyNodeCategoriesDataType, NodeTypesEnum } from '@chatbutler/shared';
+import { ClassifyNodeCategoriesDataType, NodeTypesEnum } from '@chatbutler/shared/src/index';
 import { CheckCircleIcon, XCircleIcon } from '@heroicons/react/20/solid';
 import { Fragment, memo, FC, useState, useEffect } from 'react';
 import { Handle, Position, NodeProps } from 'reactflow';

packages/web/src/nodes/ClassifyNode.tsx

@@ -1,4 +1,4 @@
-import { ClassifyNodeDataType, NodeTypesEnum } from '@chatbutler/shared';
+import { ClassifyNodeDataType, NodeTypesEnum } from '@chatbutler/shared/src/index';
 import { memo, FC, useState } from 'react';
 import { Handle, Position, NodeProps } from 'reactflow';
 import useUndo from 'use-undo';

packages/web/src/nodes/CombineNode.tsx

@@ -1,4 +1,4 @@
-import { CombineDataType } from '@chatbutler/shared';
+import { CombineDataType } from '@chatbutler/shared/src/index';
 import { Disclosure } from '@headlessui/react';
 import { SignalIcon, ClipboardIcon } from '@heroicons/react/20/solid';
 import { memo, FC, useState } from 'react';

packages/web/src/nodes/ConditionalNode.tsx

@@ -1,4 +1,4 @@
-import { ConditionalDataType, ConditionalBooleanOperation } from '@chatbutler/shared';
+import { ConditionalDataType, ConditionalBooleanOperation } from '@chatbutler/shared/src/index';
 import { CheckIcon, XMarkIcon } from '@heroicons/react/20/solid';
 import { memo, FC, useState } from 'react';
 import { Handle, Position, NodeProps } from 'reactflow';

packages/web/src/nodes/CounterNode.tsx

@@ -1,4 +1,4 @@
-import { CounterDataType } from '@chatbutler/shared';
+import { CounterDataType } from '@chatbutler/shared/src/index';
 import { PlusIcon } from '@heroicons/react/20/solid';
 import { memo, FC, useState } from 'react';
 import { Handle, Position, NodeProps } from 'reactflow';

packages/web/src/nodes/FileTextNode.tsx

@@ -1,4 +1,4 @@
-import { FileTextDataType } from '@chatbutler/shared';
+import { FileTextDataType } from '@chatbutler/shared/src/index';
 import { memo, FC, useState } from 'react';
 import { Handle, Position, NodeProps } from 'reactflow';
 import useUndo from 'use-undo';

packages/web/src/nodes/InputTextNode.tsx

@@ -1,4 +1,4 @@
-import { InputTextDataType } from '@chatbutler/shared';
+import { InputTextDataType } from '@chatbutler/shared/src/index';
 import { memo, FC, useState } from 'react';
 import { Handle, Position, NodeProps } from 'reactflow';
 import useUndo from 'use-undo';

packages/web/src/nodes/LLMPromptNode.tsx

@@ -1,4 +1,4 @@
-import { LLMPromptNodeDataType } from '@chatbutler/shared';
+import { LLMPromptNodeDataType } from '@chatbutler/shared/src/index';
 import { memo, FC, useState } from 'react';
 import { Handle, Position, NodeProps } from 'reactflow';
 import useUndo from 'use-undo';

packages/web/src/nodes/LoopNode.tsx

@@ -1,4 +1,4 @@
-import { LoopDataType } from '@chatbutler/shared';
+import { LoopDataType } from '@chatbutler/shared/src/index';
 import { ArrowPathIcon } from '@heroicons/react/20/solid';
 import { memo, FC, useState } from 'react';
 import { Handle, Position, NodeProps } from 'reactflow';

packages/web/src/nodes/OutputTextNode.tsx

@@ -1,4 +1,4 @@
-import { OutputTextDataType } from '@chatbutler/shared';
+import { OutputTextDataType } from '@chatbutler/shared/src/index';
 import { memo, FC, useState } from 'react';
 import { Handle, Position, NodeProps } from 'reactflow';
 import useUndo from 'use-undo';

packages/web/src/nodes/PlaceholderNode.tsx

@@ -1,4 +1,4 @@
-import { NodeTypesEnum, PlaceholderDataType } from '@chatbutler/shared';
+import { NodeTypesEnum, PlaceholderDataType } from '@chatbutler/shared/src/index';
 import { PlusIcon } from '@heroicons/react/20/solid';
 import { FC } from 'react';
 import { Handle, NodeProps, Position } from 'reactflow';

packages/web/src/nodes/SearchNode.tsx

@@ -1,4 +1,4 @@
-import { SearchDataType } from '@chatbutler/shared';
+import { SearchDataType } from '@chatbutler/shared/src/index';
 import { Switch } from '@headlessui/react';
 import { memo, FC, useState } from 'react';
 import { Handle, Position, NodeProps } from 'reactflow';

packages/web/src/nodes/SingleChatPromptNode.tsx

@@ -1,4 +1,4 @@
-import { SingleChatPromptDataType, ChatMessageNodeDataType } from '@chatbutler/shared';
+import { SingleChatPromptDataType, ChatMessageNodeDataType } from '@chatbutler/shared/src/index';
 import { memo, FC, useState } from 'react';
 import { Handle, Position, NodeProps } from 'reactflow';
 import useUndo from 'use-undo';

packages/web/src/nodes/TextNode.tsx

@@ -1,4 +1,4 @@
-import { TextNodeDataType } from '@chatbutler/shared';
+import { TextNodeDataType } from '@chatbutler/shared/src/index';
 import { memo, FC, useState } from 'react';
 import { Handle, Position, NodeProps } from 'reactflow';
 import useUndo from 'use-undo';

packages/web/src/nodes/templates/InputNodesList.tsx

@@ -1,4 +1,9 @@
-import { DefaultNodeDataType, InputNode, NodeTypesEnum, CustomNode } from '@chatbutler/shared';
+import {
+	DefaultNodeDataType,
+	InputNode,
+	NodeTypesEnum,
+	CustomNode,
+} from '@chatbutler/shared/src/index';
 import { shallow } from 'zustand/shallow';
 
 import useStore, { selector } from '../../store/useStore';

packages/web/src/nodes/templates/NodeTemplate.tsx

@@ -1,4 +1,4 @@
-import { NodeTypesEnum, DefaultNodeDataType } from '@chatbutler/shared';
+import { NodeTypesEnum, DefaultNodeDataType, OpenAIAPIRequest } from '@chatbutler/shared/src/index';
 import {
 	ArrowPathIcon,
 	ArrowsPointingOutIcon,
@@ -111,6 +111,32 @@ const NodeTemplate: FC<
 			<NodeToolbar position={Position.Top} isVisible={data.isLoading}>
 				<Loading className="h-12 w-12 animate-spin text-green-500" />
 			</NodeToolbar>
+			<NodeToolbar
+				position={Position.Bottom}
+				isVisible={
+					!!type &&
+					[
+						NodeTypesEnum.chatPrompt,
+						NodeTypesEnum.singleChatPrompt,
+						NodeTypesEnum.classify,
+						NodeTypesEnum.llmPrompt,
+						NodeTypesEnum.search,
+					].includes(type as NodeTypesEnum)
+				}
+			>
+				{(data as DefaultNodeDataType & OpenAIAPIRequest).model && (
+					<div className="flex gap-2">
+						<p className="text-slate-600">
+							credits:{' '}
+							{(data as DefaultNodeDataType & OpenAIAPIRequest).model.startsWith(
+								'gpt-4',
+							)
+								? '10'
+								: '1'}
+						</p>
+					</div>
+				)}
+			</NodeToolbar>
 			<NodeToolbar
 				position={Position.Right}
 				isVisible={!!data.loopId && data.children.length === 0}

packages/web/src/nodes/templates/TextAreaTemplate.tsx

@@ -1,4 +1,4 @@
-import { DefaultNodeDataType } from '@chatbutler/shared';
+import { DefaultNodeDataType } from '@chatbutler/shared/src/index';
 import { memo, FC } from 'react';
 import { NodeProps } from 'reactflow';
 import { shallow } from 'zustand/shallow';

packages/web/src/nodes/types/Input.tsx

@@ -1,4 +1,4 @@
-import { InputNode } from '@chatbutler/shared';
+import { InputNode } from '@chatbutler/shared/src/index';
 
 type InputExample = {
 	[key: string]: {

packages/web/src/pages/app/App.tsx

@@ -1,4 +1,4 @@
-import { NodeTypesEnum } from '@chatbutler/shared';
+import { NodeTypesEnum } from '@chatbutler/shared/src/index';
 import { ChevronDoubleRightIcon } from '@heroicons/react/20/solid';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import ReactFlow, {

packages/web/src/pages/app/SandboxExecutionPanel.tsx

@@ -1,4 +1,4 @@
-import { LoopDataType, NodeTypesEnum } from '@chatbutler/shared';
+import { LoopDataType, NodeTypesEnum } from '@chatbutler/shared/src/index';
 import { useRef, useState } from 'react';
 
 import RunFromStart from '../../components/RunFromStart';

packages/web/src/pages/chat/Chat.tsx

@@ -1,4 +1,4 @@
-import { WorkflowDbSchema } from '@chatbutler/shared';
+import { WorkflowDbSchema } from '@chatbutler/shared/src/index';
 import { useEffect, useRef, useState } from 'react';
 import { shallow } from 'zustand/shallow';
 

packages/web/src/pages/chat/ChatbotList.tsx

@@ -1,4 +1,4 @@
-import { WorkflowDbSchema } from '@chatbutler/shared';
+import { WorkflowDbSchema } from '@chatbutler/shared/src/index';
 
 import { conditionalClassNames } from '../../utils/classNames';
 

packages/web/src/pages/chat/layout/SideNav.tsx

@@ -1,4 +1,4 @@
-import { ChatSessionType } from '@chatbutler/shared';
+import { ChatSessionType } from '@chatbutler/shared/src/index';
 import { Dialog, Transition } from '@headlessui/react';
 import { PlusIcon } from '@heroicons/react/20/solid';
 import { Bars3Icon, ChatBubbleLeftEllipsisIcon, XMarkIcon } from '@heroicons/react/24/outline';

packages/web/src/pages/overview/Overview.tsx

@@ -1,4 +1,4 @@
-import { SimpleWorkflow } from '@chatbutler/shared';
+import { SimpleWorkflow } from '@chatbutler/shared/src/index';
 import { Session } from '@supabase/supabase-js';
 import { nanoid } from 'nanoid';
 import { useEffect, useState } from 'react';

packages/web/src/pages/overview/components/Breadcrumbs.tsx

@@ -1,4 +1,4 @@
-import { SimpleWorkflow } from '@chatbutler/shared';
+import { SimpleWorkflow } from '@chatbutler/shared/src/index';
 
 export default function Breadcrumbs({
 	chatbot,

packages/web/src/pages/overview/components/ChatbotDetails.tsx

@@ -1,4 +1,4 @@
-import { SimpleWorkflow } from '@chatbutler/shared';
+import { SimpleWorkflow } from '@chatbutler/shared/src/index';
 import { TrashIcon } from '@heroicons/react/24/outline';
 import { Session } from '@supabase/supabase-js';
 import { useEffect, useState } from 'react';

packages/web/src/pages/overview/components/ChatbotMenu.tsx

@@ -1,4 +1,4 @@
-import { SimpleWorkflow } from '@chatbutler/shared';
+import { SimpleWorkflow } from '@chatbutler/shared/src/index';
 import { Menu, Transition } from '@headlessui/react';
 import { EllipsisVerticalIcon } from '@heroicons/react/20/solid';
 import { Session } from '@supabase/supabase-js';

packages/web/src/pages/overview/components/ChatbotMenuPanel.tsx

@@ -1,4 +1,4 @@
-import { SimpleWorkflow } from '@chatbutler/shared';
+import { SimpleWorkflow } from '@chatbutler/shared/src/index';
 import { Dialog, Transition } from '@headlessui/react';
 import { Fragment, useEffect, useRef, useState } from 'react';
 

packages/web/src/pages/overview/components/DocumentUploader.tsx

@@ -1,4 +1,4 @@
-import { DocSource, SimpleWorkflow } from '@chatbutler/shared';
+import { DocSource, SimpleWorkflow } from '@chatbutler/shared/src/index';
 import { useState } from 'react';
 import { shallow } from 'zustand/shallow';
 

packages/web/src/pages/overview/utils/uploadFile.ts

@@ -1,4 +1,4 @@
-import { DocSource, SimpleWorkflow } from '@chatbutler/shared';
+import { DocSource, SimpleWorkflow } from '@chatbutler/shared/src/index';
 import { Session } from '@supabase/supabase-js';
 
 import { RFState } from '../../../store/useStore';

packages/web/src/pages/overview/utils/uploadWebsiteUrl.ts

@@ -1,4 +1,4 @@
-import { DocSource, SimpleWorkflow } from '@chatbutler/shared';
+import { DocSource, SimpleWorkflow } from '@chatbutler/shared/src/index';
 import { Session } from '@supabase/supabase-js';
 
 import { RFState } from '../../../store/useStore';

packages/web/src/pages/settings/Settings.tsx

@@ -1,4 +1,4 @@
-import { Database } from '@chatbutler/shared';
+import { Database } from '@chatbutler/shared/src/index';
 import { CubeIcon, UserCircleIcon } from '@heroicons/react/24/outline';
 import { SupabaseClient } from '@supabase/supabase-js';
 import { useEffect, useState } from 'react';

packages/web/src/pages/settings/components/PlanSettings.tsx

@@ -1,4 +1,4 @@
-import { Database } from '@chatbutler/shared';
+import { Database } from '@chatbutler/shared/src/index';
 import { CheckCircleIcon } from '@heroicons/react/20/solid';
 import { SupabaseClient } from '@supabase/supabase-js';
 

packages/web/src/store/initialNodes.ts

@@ -1,4 +1,4 @@
-import { CustomNode, NodeTypesEnum } from '@chatbutler/shared';
+import { CustomNode, NodeTypesEnum } from '@chatbutler/shared/src/index';
 
 import { Inputs } from '../nodes/types/Input';
 

packages/web/src/store/onAdd.ts

@@ -5,7 +5,7 @@ import {
 	NodeTypesEnum,
 	PlaceholderDataType,
 	SearchDataType,
-} from '@chatbutler/shared';
+} from '@chatbutler/shared/src/index';
 import { nanoid } from 'nanoid';
 import { addEdge, MarkerType, Node } from 'reactflow';
 

packages/web/src/store/onConnect.ts

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
-import { CustomNode } from '@chatbutler/shared';
+import { CustomNode } from '@chatbutler/shared/src/index';
 import { Connection, addEdge, MarkerType, Edge } from 'reactflow';
 
 import { RFState, UseStoreSetType } from './useStore';

packages/web/src/store/onEdgesDelete.ts

@@ -1,4 +1,4 @@
-import { CustomNode, NodeTypesEnum } from '@chatbutler/shared';
+import { CustomNode, NodeTypesEnum } from '@chatbutler/shared/src/index';
 import { getAllChildren } from '@chatbutler/shared/src/utils/getAllChildren';
 
 import { assignInputsToChildren } from './onConnect';

packages/web/src/store/onPlaceholderAdd.ts

@@ -1,4 +1,4 @@
-import { ChatMessageNodeDataType, NodeTypesEnum } from '@chatbutler/shared';
+import { ChatMessageNodeDataType, NodeTypesEnum } from '@chatbutler/shared/src/index';
 import { MarkerType } from 'reactflow';
 
 import { RFState, UseStoreSetType } from './useStore';

packages/web/src/store/storage.ts

@@ -1,4 +1,4 @@
-import { CustomNode } from '@chatbutler/shared';
+import { CustomNode } from '@chatbutler/shared/src/index';
 import { PersistStorage } from 'zustand/middleware';
 
 import { RFState } from './useStore';

packages/web/src/store/updateNode.ts

@@ -1,4 +1,4 @@
-import { InputNode, LLMPromptNodeDataType, TextNodeDataType } from '@chatbutler/shared';
+import { InputNode, LLMPromptNodeDataType, TextNodeDataType } from '@chatbutler/shared/src/index';
 import { Node } from 'reactflow';
 
 import { RFState, UseStoreSetType } from './useStore';

packages/web/src/store/useStore.ts

@@ -8,7 +8,7 @@ import {
 	NodeTypesEnum,
 	SimpleWorkflow,
 	TextNodeDataType,
-} from '@chatbutler/shared';
+} from '@chatbutler/shared/src/index';
 import {
 	Connection,
 	Edge,

packages/web/src/utils/getChildren.ts

@@ -1,4 +1,4 @@
-import { CustomNode } from '@chatbutler/shared';
+import { CustomNode } from '@chatbutler/shared/src/index';
 
 // Helper function to collect all children of the skipped nodes that has no other parents to lead to them
 export function getAllChildren(

packages/web/src/utils/handleFormChange.ts

@@ -1,4 +1,4 @@
-import { DefaultNodeDataType } from '@chatbutler/shared';
+import { DefaultNodeDataType } from '@chatbutler/shared/src/index';
 
 export function handleChange(
 	event:

packages/web/src/utils/parsePromptInputs.ts

@@ -1,4 +1,4 @@
-import { CustomNode } from '@chatbutler/shared';
+import { CustomNode } from '@chatbutler/shared/src/index';
 
 import { RFState } from '../store/useStore';