├── src ├── style.css ├── static │ └── audio.png ├── context.js ├── components │ ├── chat │ │ ├── elements │ │ │ ├── UploadVideoQueryCard.vue │ │ │ ├── EllipsesLoading.vue │ │ │ ├── SetupCard.vue │ │ │ ├── NotificationCenter.vue │ │ │ ├── ChatInputImagePreview.vue │ │ │ ├── SetupScreen.vue │ │ │ ├── CollectionHeader.vue │ │ │ ├── Header.vue │ │ │ ├── ChatMessageSteps.vue │ │ │ ├── UploadNotifications.vue │ │ │ └── DefaultScreen.vue │ │ ├── VideoView.vue │ │ └── ChatMessage.vue │ ├── hooks │ │ └── useChatInterface.js │ ├── collection │ │ ├── VideoListLoader.vue │ │ ├── PaginationButton.vue │ │ ├── VideoCardLoader.vue │ │ ├── VideoList.vue │ │ ├── ImageCard.vue │ │ ├── AudioCard.vue │ │ └── VideoCard.vue │ ├── icons │ │ ├── RedCheck.vue │ │ ├── VideoDBLogo.vue │ │ ├── RightArrow.vue │ │ ├── Cross.vue │ │ ├── play.vue │ │ ├── WarningExclamation.vue │ │ ├── Send.vue │ │ ├── ChevronDown.vue │ │ ├── Shape1.vue │ │ ├── Info.vue │ │ ├── Delete3.vue │ │ ├── Delete.vue │ │ ├── Star.vue │ │ ├── Check.vue │ │ ├── RedExclamation.vue │ │ ├── ExternalLink.vue │ │ ├── SearchCross.vue │ │ ├── CrossCircled.vue │ │ ├── PaperClip.vue │ │ ├── SearchIcon.vue │ │ ├── PauseIcon.vue │ │ ├── Plus.vue │ │ ├── ChatEnter.vue │ │ ├── QuestionMark.vue │ │ ├── ChevronRightCircled.vue │ │ ├── Eye.vue │ │ ├── CreateCollection.vue │ │ ├── Compose.vue │ │ ├── CopyIcon.vue │ │ ├── AtIcon.vue │ │ ├── Delete2.vue │ │ ├── Agent.vue │ │ ├── Chat.vue │ │ ├── FileUpload.vue │ │ ├── Query.vue │ │ ├── Menu.vue │ │ ├── Collection.vue │ │ └── Director.vue │ ├── atoms │ │ └── WithPopper.vue │ ├── buttons │ │ └── Button.vue │ ├── message-handlers │ │ ├── ChatSearchResults.vue │ │ ├── ImageHandler.vue │ │ ├── search │ │ │ ├── SearchListItemLoader.vue │ │ │ └── SearchListItem.vue │ │ ├── ChatVideos.vue │ │ ├── elements │ │ │ └── LoadingMessage.vue │ │ ├── TextResponse.vue │ │ └── ChatVideo.vue │ ├── modals │ │ ├── DeleteCollectionErrorModal.vue │ │ ├── ConfirmModal.vue │ │ ├── CreateCollectionModal.vue │ │ └── UploadModal.vue │ └── utils │ │ └── index.js └── index.ts ├── postcss.config.js ├── .prettierrc ├── .gitignore ├── tsconfig.app.json ├── .github ├── pull_request_template.md └── workflows │ └── release-package.yml ├── vite.config.ts ├── package.json └── CHANGELOG.md /src/style.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; 4 | -------------------------------------------------------------------------------- /src/static/audio.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/video-db/videodb-chat/HEAD/src/static/audio.png -------------------------------------------------------------------------------- /src/context.js: -------------------------------------------------------------------------------- 1 | import { inject } from "vue"; 2 | export const useVideoDBChat = () => inject("videodb-chat"); 3 | -------------------------------------------------------------------------------- /postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | tailwindcss: {}, 4 | autoprefixer: {}, 5 | }, 6 | } 7 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "plugins": ["prettier-plugin-tailwindcss"], 3 | "tailwindConfig": "./tailwind.config.js" 4 | } 5 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | *.log 2 | .DS_Store 3 | node_modules 4 | dist 5 | types 6 | 7 | packages/docs/.vitepress/cache 8 | packages/*/dist 9 | packages/*/types 10 | 11 | *.tsbuildinfo 12 | 13 | TODO.md -------------------------------------------------------------------------------- /tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "@vue/tsconfig/tsconfig.dom.json", 3 | "include": ["src/env.d.ts", "src/**/*", "src/**/*.vue"], 4 | "exclude": ["src/**/__tests__/*"], 5 | "compilerOptions": { 6 | "composite": true, 7 | "outDir": "dist", 8 | "declarationDir": "types", 9 | "allowJs": true, 10 | "baseUrl": ".", 11 | "rootDir": "src", 12 | "paths": { 13 | "@/*": ["./src/*"] 14 | } 15 | } 16 | } -------------------------------------------------------------------------------- /src/components/chat/elements/UploadVideoQueryCard.vue: -------------------------------------------------------------------------------- 1 | 10 | 11 | 21 | -------------------------------------------------------------------------------- /src/components/hooks/useChatInterface.js: -------------------------------------------------------------------------------- 1 | import { ref, reactive } from "vue"; 2 | 3 | export function useChatInterface() { 4 | const messageHandlers = {}; 5 | const chatInput = ref(""); 6 | const chatAttachments = reactive([]) 7 | 8 | const registerMessageHandler = (contentType, handler) => { 9 | messageHandlers[contentType] = handler; 10 | }; 11 | 12 | const setChatInput = (input) => { 13 | chatInput.value = input; 14 | }; 15 | 16 | return { 17 | chatInput, 18 | chatAttachments, 19 | setChatInput, 20 | messageHandlers, 21 | registerMessageHandler, 22 | }; 23 | } 24 | -------------------------------------------------------------------------------- /src/components/collection/VideoListLoader.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 23 | -------------------------------------------------------------------------------- /.github/pull_request_template.md: -------------------------------------------------------------------------------- 1 | ## Pull Request 2 | 3 | **Description:** 4 | Describe the purpose of this pull request. 5 | 6 | **Changes:** 7 | - [ ] Feature A 8 | - [ ] Bugfix B 9 | 10 | **Related Issues:** 11 | - Closes #123 12 | - Addresses #456 13 | 14 | **Testing:** 15 | Describe any testing steps that have been taken or are necessary. 16 | Make sure to take in account any existing code change that require some feature to be re-tested. 17 | 18 | 19 | **Checklist:** 20 | - [ ] Code follows project coding standards 21 | - [ ] Tests have been added or updated 22 | - [ ] Code Review 23 | - [ ] Manual test after merge 24 | - [ ] All checks passed -------------------------------------------------------------------------------- /src/components/icons/RedCheck.vue: -------------------------------------------------------------------------------- 1 | 17 | 18 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /src/components/icons/VideoDBLogo.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /src/components/icons/RightArrow.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 36 | -------------------------------------------------------------------------------- /src/components/icons/Cross.vue: -------------------------------------------------------------------------------- 1 | 16 | 17 | 32 | -------------------------------------------------------------------------------- /src/components/icons/play.vue: -------------------------------------------------------------------------------- 1 | 16 | 17 | 28 | 29 | 34 | -------------------------------------------------------------------------------- /src/components/icons/WarningExclamation.vue: -------------------------------------------------------------------------------- 1 | 18 | 19 | 29 | 30 | 35 | -------------------------------------------------------------------------------- /src/components/icons/Send.vue: -------------------------------------------------------------------------------- 1 | 16 | 17 | 27 | 28 | -------------------------------------------------------------------------------- /src/components/atoms/WithPopper.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 38 | 43 | -------------------------------------------------------------------------------- /src/components/icons/ChevronDown.vue: -------------------------------------------------------------------------------- 1 | 24 | 42 | -------------------------------------------------------------------------------- /src/components/buttons/Button.vue: -------------------------------------------------------------------------------- 1 | 18 | 19 | 30 | -------------------------------------------------------------------------------- /src/components/icons/Shape1.vue: -------------------------------------------------------------------------------- 1 | 17 | 18 | 29 | -------------------------------------------------------------------------------- /src/components/icons/Info.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 31 | -------------------------------------------------------------------------------- /src/components/icons/Delete3.vue: -------------------------------------------------------------------------------- 1 | 15 | 16 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /src/components/icons/Delete.vue: -------------------------------------------------------------------------------- 1 | 15 | 16 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /src/components/icons/Star.vue: -------------------------------------------------------------------------------- 1 | 20 | 21 | 31 | 32 | 37 | -------------------------------------------------------------------------------- /src/components/icons/Check.vue: -------------------------------------------------------------------------------- 1 | 18 | 19 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /src/components/chat/elements/EllipsesLoading.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 19 | 20 | -------------------------------------------------------------------------------- /src/components/icons/RedExclamation.vue: -------------------------------------------------------------------------------- 1 | 2 | 3 | 31 | 32 | 42 | 43 | 48 | -------------------------------------------------------------------------------- /src/components/icons/ExternalLink.vue: -------------------------------------------------------------------------------- 1 | 27 | 42 | 43 | 49 | -------------------------------------------------------------------------------- /src/components/icons/SearchCross.vue: -------------------------------------------------------------------------------- 1 | 23 | 24 | 43 | 44 | 50 | -------------------------------------------------------------------------------- /src/components/message-handlers/ChatSearchResults.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /src/index.ts: -------------------------------------------------------------------------------- 1 | import type { App } from "vue"; 2 | import ChatInterface from "./components/chat/ChatInterface.vue"; 3 | import DefaultScreen from "./components/chat/elements/DefaultScreen.vue"; 4 | import ChatMessageContainer from "./components/chat/ChatMessageContainer.vue"; 5 | import Sidebar from "./components/chat/elements/Sidebar.vue"; 6 | import { useChatInterface } from "./components/hooks/useChatInterface"; 7 | import { useVideoDBChat } from "./context"; 8 | import ChatSearchResults from "./components/message-handlers/ChatSearchResults.vue"; 9 | import ChatVideo from "./components/message-handlers/ChatVideo.vue"; 10 | import ChatVideos from "./components/message-handlers/ChatVideos.vue"; 11 | import ImageHandler from "./components/message-handlers/ImageHandler.vue"; 12 | import TextResponse from "./components/message-handlers/TextResponse.vue"; 13 | import "./style.css"; 14 | 15 | function install(app: App) { 16 | app.component("ChatInterface", ChatInterface); 17 | } 18 | 19 | export { 20 | ChatInterface, 21 | DefaultScreen, 22 | ChatMessageContainer, 23 | Sidebar, 24 | ChatSearchResults, 25 | ChatVideo, 26 | ChatVideos, 27 | ImageHandler, 28 | TextResponse, 29 | useVideoDBChat, 30 | useChatInterface, 31 | install, 32 | }; 33 | -------------------------------------------------------------------------------- /src/components/collection/PaginationButton.vue: -------------------------------------------------------------------------------- 1 | 17 | 18 | 45 | 46 | 47 | -------------------------------------------------------------------------------- /vite.config.ts: -------------------------------------------------------------------------------- 1 | /// 2 | import { defineConfig } from 'vite' 3 | import vue from '@vitejs/plugin-vue' 4 | import { fileURLToPath } from 'url' 5 | 6 | export default defineConfig({ 7 | plugins: [vue()], 8 | resolve: { 9 | alias: { 10 | /* 11 | * We recommend to not use aliases in the lib's source, 12 | * because they will leak into the generated d.ts files and then 13 | * break the lib's types in the consuming app. 14 | */ 15 | }, 16 | }, 17 | build: { 18 | lib: { 19 | name: 'Lib', // TODO: CHANGE_ME 20 | entry: fileURLToPath(new URL('./src/index.ts', import.meta.url)), 21 | formats: ['es', 'cjs', 'iife'], 22 | fileName: (format) => { 23 | switch (format) { 24 | case 'es': 25 | return 'index.mjs' 26 | case 'cjs': 27 | return 'index.cjs' 28 | case 'iife': 29 | return 'index.js' 30 | default: 31 | return 'index.js' 32 | } 33 | }, 34 | }, 35 | minify: false, 36 | rollupOptions: { 37 | external: ['vue'], 38 | output: { 39 | banner: ` 40 | /** 41 | * Copyright ${new Date(Date.now()).getFullYear()} VideoDB 42 | * @license MIT 43 | **/ 44 | `, 45 | exports: 'named', 46 | globals: { 47 | vue: 'Vue', 48 | }, 49 | }, 50 | }, 51 | }, 52 | test: { 53 | environment: 'jsdom', 54 | }, 55 | }) -------------------------------------------------------------------------------- /src/components/icons/CrossCircled.vue: -------------------------------------------------------------------------------- 1 | 17 | 18 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /src/components/icons/PaperClip.vue: -------------------------------------------------------------------------------- 1 | 15 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /src/components/icons/SearchIcon.vue: -------------------------------------------------------------------------------- 1 | 24 | 25 | 40 | 41 | 47 | -------------------------------------------------------------------------------- /src/components/icons/PauseIcon.vue: -------------------------------------------------------------------------------- 1 | 20 | 21 | 29 | 30 | 35 | -------------------------------------------------------------------------------- /src/components/icons/Plus.vue: -------------------------------------------------------------------------------- 1 | 24 | 25 | 37 | -------------------------------------------------------------------------------- /src/components/icons/ChatEnter.vue: -------------------------------------------------------------------------------- 1 | 16 | 17 | 27 | 28 | 30 | -------------------------------------------------------------------------------- /src/components/icons/QuestionMark.vue: -------------------------------------------------------------------------------- 1 | 18 | 19 | 34 | -------------------------------------------------------------------------------- /src/components/icons/ChevronRightCircled.vue: -------------------------------------------------------------------------------- 1 | 26 | 41 | 42 | 48 | -------------------------------------------------------------------------------- /src/components/icons/Eye.vue: -------------------------------------------------------------------------------- 1 | 23 | 27 | -------------------------------------------------------------------------------- /src/components/icons/CreateCollection.vue: -------------------------------------------------------------------------------- 1 | 40 | 41 | 53 | -------------------------------------------------------------------------------- /src/components/collection/VideoCardLoader.vue: -------------------------------------------------------------------------------- 1 | 29 | 30 | 45 | -------------------------------------------------------------------------------- /src/components/icons/Compose.vue: -------------------------------------------------------------------------------- 1 | 16 | 17 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /src/components/chat/elements/SetupCard.vue: -------------------------------------------------------------------------------- 1 | 37 | 38 | 52 | 53 | 58 | -------------------------------------------------------------------------------- /src/components/message-handlers/ImageHandler.vue: -------------------------------------------------------------------------------- 1 | 2 | 37 | 38 | 59 | 60 | 71 | -------------------------------------------------------------------------------- /src/components/icons/CopyIcon.vue: -------------------------------------------------------------------------------- 1 | 15 | 16 | 31 | 32 | 38 | -------------------------------------------------------------------------------- /src/components/icons/AtIcon.vue: -------------------------------------------------------------------------------- 1 | 18 | 19 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /src/components/modals/DeleteCollectionErrorModal.vue: -------------------------------------------------------------------------------- 1 | 47 | 48 | 64 | 65 | 66 | -------------------------------------------------------------------------------- /src/components/chat/VideoView.vue: -------------------------------------------------------------------------------- 1 | 43 | 44 | 74 | 75 | 76 | -------------------------------------------------------------------------------- /src/components/utils/index.js: -------------------------------------------------------------------------------- 1 | import { v1 } from 'uuid' 2 | 3 | export function secondsToHHMMSS(val) { 4 | if (!val) return '00:00:00' 5 | let time = '' 6 | time = new Date(val * 1000).toISOString().substring(11, 19) 7 | if (time.substring(0, 2) === '00') { 8 | return time.substring(3, time.length) 9 | } 10 | return time 11 | } 12 | 13 | export function randomHsl(num, total) { 14 | return 'hsla(' + ((num + 1) / (total + 1)) * 360 + ', 100%, 50%, 1)' 15 | } 16 | 17 | export function separateBulletPoints(markdownString) { 18 | // Split the markdown string into individual lines 19 | const lines = markdownString.split('\n') 20 | 21 | // Remove empty lines and trim leading/trailing whitespace from each line 22 | const cleanedLines = lines 23 | .filter((line) => line.trim() !== '') 24 | .map((line) => line.trim()) 25 | 26 | // Iterate over the cleaned lines and extract the bullet points 27 | const bulletPoints = [] 28 | let currentBulletPoint = '' 29 | 30 | cleanedLines.forEach((line) => { 31 | if (line.startsWith('-')) { 32 | // Add the current bullet point to the array 33 | if (currentBulletPoint !== '') { 34 | bulletPoints.push(currentBulletPoint.trim()) 35 | } 36 | 37 | // Start a new bullet point 38 | currentBulletPoint = line.substring(1).trim() 39 | } else { 40 | // Append the line to the current bullet point 41 | currentBulletPoint += ' ' + line.trim() 42 | } 43 | }) 44 | 45 | // Add the last bullet point to the array 46 | if (currentBulletPoint !== '') { 47 | bulletPoints.push(currentBulletPoint.trim()) 48 | } 49 | 50 | return bulletPoints 51 | } 52 | 53 | const NOT_ALLOWED_CHARS = ['\\$', '#', '\\[', '\\]', '\\.', '/'] // Escape special characters with backslashes 54 | 55 | export function generateSlug(title) { 56 | if (title.split(' ').length > 1) { 57 | const nTitle = title 58 | .split(' ') 59 | .slice(0, 10) 60 | .filter((w) => /^[a-zA-Z0-9]+$/.test(w)) 61 | .join('-') 62 | title = nTitle 63 | } 64 | 65 | for (const NOT_ALLOWED_CHAR of NOT_ALLOWED_CHARS) { 66 | title = title.replace(new RegExp(NOT_ALLOWED_CHAR, 'g'), '-') 67 | } 68 | 69 | const key = v1().replace(/-/g, '').substring(0, 8) 70 | const slug = `${title}_${key}` 71 | return slug 72 | } 73 | 74 | export default {} 75 | -------------------------------------------------------------------------------- /src/components/message-handlers/search/SearchListItemLoader.vue: -------------------------------------------------------------------------------- 1 | 43 | 44 | 64 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@videodb/chat-vue", 3 | "description": "Chat component for Director", 4 | "version": "0.0.41", 5 | "author": "VideoDB", 6 | "license": "Apache-2.0", 7 | "private": false, 8 | "homepage": "https://videodb.io", 9 | "repository": { 10 | "type": "git", 11 | "url": "https://github.com/video-db/videodb-chat.git" 12 | }, 13 | "type": "module", 14 | "main": "dist/index.cjs", 15 | "module": "dist/index.mjs", 16 | "style": "dist/style.css", 17 | "types": "types/index.d.ts", 18 | "files": [ 19 | "dist", 20 | "types", 21 | "README.md" 22 | ], 23 | "exports": { 24 | ".": { 25 | "types": "./types/index.d.ts", 26 | "import": "./dist/index.mjs", 27 | "require": "./dist/index.cjs" 28 | }, 29 | "./*": "./*" 30 | }, 31 | "typings": "types/index.d.ts", 32 | "scripts": { 33 | "dev-server": "vite", 34 | "dev-types": "vue-tsc --noEmit -p tsconfig.app.json --watch", 35 | "build": "npm run build-lib && npm run build-types", 36 | "build-lib": "vite build", 37 | "build-types": "vue-tsc --emitDeclarationOnly --declaration -p tsconfig.app.json", 38 | "lint": "eslint 'src/**/*.{ts,vue}'", 39 | "test": "vitest", 40 | "test-ci": "vitest --run", 41 | "prepublishOnly": "npm run build" 42 | }, 43 | "peerDependencies": { 44 | "vue": "^3.0.4" 45 | }, 46 | "devDependencies": { 47 | "@tsconfig/node20": "^20.1.2", 48 | "@types/node": "20.8.10", 49 | "@types/vue": "^2.0.0", 50 | "@vitejs/plugin-vue": "^4.4.0", 51 | "@vue/compiler-dom": "^3.3.8", 52 | "@vue/test-utils": "^2.4.1", 53 | "@vue/tsconfig": "^0.4.0", 54 | "autoprefixer": "^10.4.20", 55 | "eslint": "^8.53.0", 56 | "jsdom": "^22.1.0", 57 | "lint-staged": "^15.0.2", 58 | "postcss": "^8.4.41", 59 | "prettier": "^3.3.3", 60 | "prettier-plugin-tailwindcss": "^0.6.6", 61 | "run-p": "^0.0.0", 62 | "sass": "^1.77.8", 63 | "tailwindcss": "^3.4.10", 64 | "typescript": "^5.2.2", 65 | "vite": "^4.5.0", 66 | "vitest": "^0.34.6", 67 | "vue": "^3.5.13", 68 | "vue-tsc": "^2.0.29" 69 | }, 70 | "dependencies": { 71 | "@videodb/player-vue": "~0.0.6", 72 | "dayjs": "^1.11.13", 73 | "katex": "^0.16.11", 74 | "marked": "^4.2.5", 75 | "marked-katex-extension": "^5.1.2", 76 | "prismjs": "^1.29.0", 77 | "socket.io-client": "^4.7.5", 78 | "swiper": "^11.1.10", 79 | "uuid": "^10.0.0", 80 | "vue3-popper": "^1.5.0" 81 | } 82 | } 83 | -------------------------------------------------------------------------------- /src/components/message-handlers/ChatVideos.vue: -------------------------------------------------------------------------------- 1 | 26 | 27 | 75 | 76 | 93 | -------------------------------------------------------------------------------- /src/components/modals/ConfirmModal.vue: -------------------------------------------------------------------------------- 1 | 45 | 46 | 73 | -------------------------------------------------------------------------------- /.github/workflows/release-package.yml: -------------------------------------------------------------------------------- 1 | name: Publish 2 | 3 | on: 4 | pull_request: 5 | types: 6 | - closed 7 | branches: 8 | - main 9 | workflow_dispatch: 10 | 11 | jobs: 12 | build: 13 | runs-on: ubuntu-latest 14 | steps: 15 | - uses: actions/checkout@v4 16 | - uses: actions/setup-node@v3 17 | with: 18 | node-version: 20 19 | - run: npm ci 20 | 21 | publish-gpr: 22 | if: github.event_name == 'workflow_dispatch' || (github.event.pull_request.merged == true && github.event.pull_request.head.label == 'video-db:release') 23 | needs: build 24 | runs-on: ubuntu-latest 25 | permissions: 26 | packages: write 27 | contents: write 28 | steps: 29 | - uses: actions/checkout@v4 30 | - uses: actions/setup-node@v3 31 | with: 32 | node-version: 20 33 | registry-url: https://registry.npmjs.org/ 34 | - name: get-npm-version 35 | id: package-version 36 | uses: martinbeentjes/npm-get-version-action@main 37 | - name: Check Version for Tag 38 | id: npm-tag 39 | run: | 40 | VERSION=${{ steps.package-version.outputs.current-version }} 41 | if [[ $VERSION == *beta* || $VERSION == *alpha* || $VERSION == *rc* ]]; then 42 | echo "tag=next" >> $GITHUB_OUTPUT 43 | else 44 | echo "tag=latest" >> $GITHUB_OUTPUT 45 | fi 46 | ############# TAG RELEASE ############## 47 | - name: 'Push tag v${{ steps.package-version.outputs.current-version }}' 48 | if: steps.npm-tag.outputs.tag == 'latest' 49 | uses: rickstaa/action-create-tag@v1 50 | id: tag_version 51 | with: 52 | tag: 'v${{ steps.package-version.outputs.current-version }}' 53 | # ############# GITHUB RELEASE ############## 54 | - name: Extract release notes 55 | id: extract-release-notes 56 | uses: ffurrer2/extract-release-notes@v1 57 | - name: 'Create a GitHub release v${{ steps.package-version.outputs.current-version }}' 58 | if: steps.npm-tag.outputs.tag == 'latest' 59 | uses: ncipollo/release-action@v1 60 | with: 61 | tag: 'v${{ steps.package-version.outputs.current-version }}' 62 | name: 'Release v${{ steps.package-version.outputs.current-version }}' 63 | body: | 64 | ${{ steps.extract-release-notes.outputs.release_notes }} 65 | - run: npm ci 66 | - run: npm publish --access public --tag ${{ steps.npm-tag.outputs.tag }} 67 | env: 68 | NODE_AUTH_TOKEN: ${{secrets.NODE_AUTH_TOKEN}} -------------------------------------------------------------------------------- /src/components/chat/elements/NotificationCenter.vue: -------------------------------------------------------------------------------- 1 | 37 | 38 | 67 | 68 | 88 | -------------------------------------------------------------------------------- /src/components/icons/Delete2.vue: -------------------------------------------------------------------------------- 1 | 15 | 16 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /src/components/chat/elements/ChatInputImagePreview.vue: -------------------------------------------------------------------------------- 1 | 35 | 36 | 76 | -------------------------------------------------------------------------------- /src/components/icons/Agent.vue: -------------------------------------------------------------------------------- 1 | 31 | 32 | 47 | 48 | 54 | -------------------------------------------------------------------------------- /src/components/icons/Chat.vue: -------------------------------------------------------------------------------- 1 | 18 | 19 | 34 | 35 | 41 | -------------------------------------------------------------------------------- /src/components/icons/FileUpload.vue: -------------------------------------------------------------------------------- 1 | 22 | 23 | 38 | 39 | 45 | -------------------------------------------------------------------------------- /src/components/message-handlers/elements/LoadingMessage.vue: -------------------------------------------------------------------------------- 1 | 48 | 49 | 86 | 87 | 143 | -------------------------------------------------------------------------------- /src/components/icons/Query.vue: -------------------------------------------------------------------------------- 1 | 26 | 27 | 42 | 43 | 49 | -------------------------------------------------------------------------------- /src/components/chat/elements/SetupScreen.vue: -------------------------------------------------------------------------------- 1 | 47 | 48 | 95 | 96 | 99 | -------------------------------------------------------------------------------- /src/components/message-handlers/TextResponse.vue: -------------------------------------------------------------------------------- 1 | 2 | 48 | 49 | 112 | 113 | 132 | -------------------------------------------------------------------------------- /src/components/chat/ChatMessage.vue: -------------------------------------------------------------------------------- 1 | 58 | 59 | 118 | 119 | 132 | -------------------------------------------------------------------------------- /src/components/chat/elements/CollectionHeader.vue: -------------------------------------------------------------------------------- 1 | 81 | 82 | 116 | 117 | 118 | -------------------------------------------------------------------------------- /src/components/icons/Menu.vue: -------------------------------------------------------------------------------- 1 | 15 | 16 | 31 | 32 | 38 | -------------------------------------------------------------------------------- /src/components/modals/CreateCollectionModal.vue: -------------------------------------------------------------------------------- 1 | 74 | 75 | 104 | -------------------------------------------------------------------------------- /src/components/chat/elements/Header.vue: -------------------------------------------------------------------------------- 1 | 81 | 82 | 120 | 121 | 122 | -------------------------------------------------------------------------------- /src/components/message-handlers/ChatVideo.vue: -------------------------------------------------------------------------------- 1 | 73 | 74 | 110 | 111 | 128 | -------------------------------------------------------------------------------- /src/components/chat/elements/ChatMessageSteps.vue: -------------------------------------------------------------------------------- 1 | 79 | 80 | 124 | 125 | 133 | -------------------------------------------------------------------------------- /src/components/collection/VideoList.vue: -------------------------------------------------------------------------------- 1 | 77 | 78 | 157 | -------------------------------------------------------------------------------- /src/components/message-handlers/search/SearchListItem.vue: -------------------------------------------------------------------------------- 1 | 82 | 83 | 147 | -------------------------------------------------------------------------------- /src/components/collection/ImageCard.vue: -------------------------------------------------------------------------------- 1 | 66 | 67 | 118 | 119 | 174 | -------------------------------------------------------------------------------- /src/components/collection/AudioCard.vue: -------------------------------------------------------------------------------- 1 | 67 | 68 | 148 | 149 | 204 | -------------------------------------------------------------------------------- /src/components/chat/elements/UploadNotifications.vue: -------------------------------------------------------------------------------- 1 | 2 | 97 | 98 | 141 | 142 | 176 | -------------------------------------------------------------------------------- /src/components/collection/VideoCard.vue: -------------------------------------------------------------------------------- 1 | 106 | 107 | 163 | 164 | 219 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Changelog 2 | 3 | ## [0.0.41]() - 2025-09-15 4 | ## Improved 5 | - Bump Videodb Player to 0.0.6, which disposes the player on unmount 6 | 7 | 8 | ## [0.0.40]() - 2025-06-01 9 | ## Fixed 10 | - Default screen will not display demo videos if images and audios are uploaded 11 | - Copy ID Button visibility improved on hover 12 | 13 | 14 | ## [0.0.39]() - 2025-05-27 15 | ## Added 16 | - Ability to upload multiple media files at once through the `Upload Media` button 17 | 18 | ## [0.0.38]() - 2025-05-16 19 | ## Improved 20 | - Responsiveness improvements in `` 21 | - Search Box 22 | - Suggestion Box 23 | 24 | ## [0.0.37]() - 2025-05-16 25 | ## Added 26 | - `` enhancements 27 | - Displays audio and image assets alongside videos with the new `` and `` components. 28 | - Search your collection for videos, audios, and images. 29 | - Filter assets in your collection by type: Videos, Audios, Images, or All files. 30 | 31 | - Copy ID feature added for videos, images, and audio files in ``, `` and `` components. 32 | 33 | ## Improved 34 | UI improvements across `` 35 | 36 | 37 | ## [0.0.36]() - 2025-02-28 38 | 39 | ### Added 40 | - Code Syntax Highlight support for python code in `` message handler 41 | 42 | 43 | ## [0.0.35]() - 2025-02-20 44 | 45 | ### Added 46 | - Update UI Data on socket event : `event` 47 | 48 | 49 | ## [0.0.34]() - 2025-02-10 50 | 51 | ### Added 52 | - Config for Components 53 | - `sidebarConfig.enabled` 54 | - `defaultScreenConfig.enableVideoView` 55 | 56 | ## [0.0.33]() - 2025-02-07 57 | 58 | ### Fixed 59 | 60 | - Issues related to ChatMessage Scroll 61 | 62 | ## [0.0.32]() - 2025-02-06 63 | 64 | ### Added 65 | 66 | - `` Enhancements: 67 | - Improved multiline input experience. 68 | - Support for image attachments in chat (one image per message): 69 | - Ctrl + V paste. 70 | - Attach via file explorer. 71 | - New `` component to show image preview 72 | - Removed context capsule. 73 | - New `
` component: 74 | - Persistent header across all screens. 75 | - Includes a hamburger menu for mobile screens. 76 | - Update `` to show Image Inputs 77 | - VideoDB Hook 78 | 79 | - Wrapper function that calls `/videodb/collection/${collectionId}/image/${imageId}/generate_url` to director-backend to get url of uploaded image. 80 | 81 | - Custom header support: 82 | - Users can pass a custom header component to `` via the `header` slot. 83 | 84 | ### Fixed 85 | 86 | - Chat input: 87 | - Loading and disabled state for action button. 88 | - Issues related to collection and session switching. 89 | - Turn off autocomplete on Create Collection Modal's Input 90 | - Mobile screen improvements. 91 | 92 | ## [0.0.31]() - 2025-02-05 93 | 94 | ### Added 95 | 96 | - Improved Error message on Delete Collection Error Modal 97 | 98 | ## [0.0.30]() - 2025-02-03 99 | 100 | ### Added 101 | 102 | - Delete Collection feature 103 | - Delete Video from Collection 104 | - Create a new Collection 105 | 106 | ### Fixed 107 | 108 | - Minor UI fixes 109 | 110 | ## [0.0.29]() - 2025-01-30 111 | 112 | ### Added 113 | 114 | - Add optional support for Session Name in Sidebar 115 | 116 | ## [0.0.28]() - 2025-01-03 117 | 118 | ### Added 119 | 120 | - Support for UI Config to change no of columns in `ChatVideos` 121 | 122 | ## [0.0.27]() - 2024-12-19 123 | 124 | ### Added 125 | 126 | - Export `ChatMessageContainer` & Other message handler Components 127 | - Dynamic height for Sidebar Sections 128 | 129 | ## [0.0.26]() - 2024-12-18 130 | 131 | ### Added 132 | 133 | - Config to change order and visiblity of sidebar sections 134 | 135 | ### Design Changes 136 | 137 | - improve Grid layout of QueryCards in DefaultScreen for mobile 138 | 139 | ## [0.0.25]() - 2024-12-18 140 | 141 | ### Added 142 | 143 | - Explore `DefaultScreen` & `Sidebar` component 144 | - Allow `DefultScreen` to accept header in slot 145 | 146 | ### Fixed 147 | 148 | - remove unsued props from `` 149 | - change `vdb-orange` to `orange` in tailwind config to avoid confusions while themeconfig 150 | 151 | ## [0.0.24]() - 2024-12-16 152 | 153 | ### Added 154 | 155 | - Change field name from `externalUrl` to `external_url` in `ChatInterface.vue` 156 | 157 | ## [0.0.23]() - 2024-12-13 158 | 159 | ### Added 160 | 161 | - Optional Pagination for VideoList 162 | - Configurable columns for VideoList 163 | 164 | ### Fixed 165 | 166 | - videoClick handler in `` message handler 167 | 168 | ## [0.0.22]() - 2024-12-12 169 | 170 | ### Added 171 | 172 | - New message handler support for Videos (multiple videos) 173 | - Message handler key : "videos" 174 | - Message handler : `` 175 | 176 | ## [0.0.21]() - 2024-12-09 177 | 178 | ### Added 179 | 180 | - Config for Header 181 | 182 | ## [0.0.20]() - 2024-12-09 183 | 184 | ### Fixed - Config for Default Screen 185 | 186 | ## [0.0.19]() - 2024-12-09 187 | 188 | ### Fixed - Config for Default Screen 189 | 190 | ### [0.0.18]() - 2024-12-04 191 | 192 | ### Added 193 | 194 | - Agent Icon 195 | 196 | ### [0.0.17]() - 2024-12-04 197 | 198 | ### Changed 199 | 200 | - Sidebar Alignement 201 | - Update icons 202 | 203 | ### [0.0.16]() - 2024-12-04 204 | 205 | ### Changed 206 | 207 | - Director Icon Replaced with Beta 208 | - Delete Modal as seperate component 209 | - Default Screen Improvements for mobile 210 | - Sidebar Issues in mobile 211 | - Query card improvements 212 | 213 | ### [0.0.15]() - 2024-12-03 214 | 215 | ### Fixed 216 | 217 | - Hotfix collection refresh error 218 | 219 | ### [0.0.14]() - 2024-12-03 220 | 221 | ### Added 222 | 223 | - Default Screen UX improvements 224 | 225 | ### [0.0.13]() - 2024-12-03 226 | 227 | ### Added 228 | 229 | - Chat Input UX improvements 230 | - Context Icon 231 | - Query card copy changes 232 | - Sidebar design changes 233 | 234 | ### [0.0.12]() - 2024-12-03 235 | 236 | ### Added 237 | 238 | - Query Card UX improvments 239 | 240 | ### [0.0.11]() - 2024-11-29 241 | 242 | ### Added 243 | 244 | - Upload Notifications 245 | - Upload Button copy changes 246 | 247 | ### [0.0.10]() - 2024-11-28 248 | 249 | ### Added 250 | 251 | - Upload Modal 252 | 253 | ## [0.0.9]() - 2024-11-27 254 | 255 | ### Updated 256 | 257 | - Bump `@videodb/player-vue` to `~0.0.4` 258 | 259 | ### [0.0.8]() - 2024-11-22 260 | 261 | ### Changed 262 | 263 | - Update `@videodb/player-vue` to `~0.0.3` 264 | - Responsiveness improvments 265 | 266 | ### [0.0.7]() - 2024-11-21 267 | 268 | ### Added 269 | 270 | - `` 271 | - UX improvements 272 | - Collection Preview 273 | - Query Card improvments 274 | - `` to support inline video players 275 | 276 | ### [0.0.6]() 277 | 278 | ### Fixed 279 | 280 | - Interaction of "Upload Video" button in CollectionView when Collection is empty 281 | 282 | ### [0.0.5]() - 2024-10-23 283 | 284 | ### Added 285 | 286 | - Setup Screen 287 | - Delete Session 288 | - Video View in session History 289 | - Expose ChatInputRef & createNewSession() 290 | - Highlight isFocused state in LoadingMessage 291 | 292 | ### Fixes 293 | 294 | - Full Screen for message handler 295 | - Open Directors Log only when status is not success 296 | - Minor tweak in Default Screen's search suggestions 297 | - Fix Sidebar's Icon anaimation 298 | 299 | ### [0.0.4]() - 2024-09-18 300 | 301 | ### Added 302 | 303 | - Addtional UI Components for Sidebar, VideoView, CollectionView & Default Screen 304 | - Enhanced UX 305 | 306 | ### Changed 307 | 308 | - Update default chat hook 309 | - Update Message handlers to support new conversation structure 310 | 311 | ## [0.0.3]() - 2024-09-16 312 | 313 | ### Changed 314 | 315 | - Default chat Hook : send id as string 316 | 317 | ## [0.0.2]() - 2024-09-16 318 | 319 | ### Changed 320 | 321 | - Support for Custom Chat Hook 322 | - Improve interface for default Chat Hook 323 | - Cleanup Components 324 | 325 | **✨ Initial Release** 326 | 327 | - Component for VideoDB Chat 328 | - Chat Interface 329 | - Agent Handler 330 | - Search (includes compilation video player & search results) 331 | 332 | ## [0.0.1]() - 2024-09-09 333 | 334 | ### Added 335 | 336 | **✨ Initial Release** 337 | 338 | - Component for VideoDB Chat 339 | - Chat Interface 340 | - Agent Handler 341 | - Search (includes compilation video player & search results) 342 | -------------------------------------------------------------------------------- /src/components/icons/Collection.vue: -------------------------------------------------------------------------------- 1 | 36 | 37 | 52 | 53 | 59 | -------------------------------------------------------------------------------- /src/components/icons/Director.vue: -------------------------------------------------------------------------------- 1 | 71 | 72 | 83 | 84 | 85 | -------------------------------------------------------------------------------- /src/components/chat/elements/DefaultScreen.vue: -------------------------------------------------------------------------------- 1 | 213 | 214 | 276 | 277 | 303 | -------------------------------------------------------------------------------- /src/components/modals/UploadModal.vue: -------------------------------------------------------------------------------- 1 | 174 | 175 | 338 | 339 | 362 | --------------------------------------------------------------------------------