Merge branch 'main' of https://github.com/enricoros/big-agi

.github/ISSUE_TEMPLATE/maintainers-release.md

@@ -7,7 +7,7 @@ assignees: enricoros
 
 ---
 
-Release checklist:
+## Release checklist:
 
 - [ ] Update the [Roadmap](https://github.com/users/enricoros/projects/4/views/2) calling out shipped features
 - [ ] Create and update a [Milestone](https://github.com/enricoros/big-agi/milestones) for the release
@@ -31,3 +31,31 @@ Release checklist:
 - Announce:
   - [ ] Discord announcement
   - [ ] Twitter announcement
+
+## Artifacts
+
+1) first copy and paste the former release `discord announcement`, `news.data.ts`, `changelog.md`, `README.md`
+2) then copy and paste the milestone and each indivdual issue (content will be downloaded)
+3) then paste the git changelog 1.2.2...1.2.3
+
+### news.data.tsx
+
+```markdown
+I need the following from you:
+
+1. a table summarizing all the new features in 1.2.3, which will be used for the artifacts later
+2. after the table score each feature from a user impact and magnitude point of view
+3. Improve the table, in decreasing order of importance for features, fixing any detail that's missing
+4. I want you then to update the news.data.tsx for the new release
+```
+
+### GitHub release
+
+Now paste the former release (or 1.5.0 which was accurate and great), including the new contributors and
+some stats (# of commits, etc.), and roll it for the new release.
+
+### Discord announcement
+
+```markdown
+Can you generate my 1.2.3 big-AGI discord announcement from the GitHub Release announcement, and the in-app News?
+```

README.md

@@ -21,7 +21,17 @@ shows the current developments and future ideas.
 - Got a suggestion? [_Add your roadmap ideas_](https://github.com/enricoros/big-agi/issues/new?&template=roadmap-request.md)
 - Want to contribute? [_Pick up a task!_](https://github.com/users/enricoros/projects/4/views/4) - _easy_ to _pro_
 
-### What's New in 1.5.0 🌟
+### What's New in 1.6.0 - Nov 28, 2023 🌟
+
+- **Web Browsing**: Download web pages within chats - [browsing guide](https://github.com/enricoros/big-agi/blob/main/docs/config-browse.md)
+- **Branching Discussions**: Create new conversations from any message
+- **Keyboard Navigation**: Swift chat navigation with new shortcuts (e.g. ctrl+alt+left/right)
+- **Performance Boost**: Faster rendering for a smoother experience
+- **UI Enhancements**: Refined interface based on user feedback
+- **New Features**: Anthropic Claude 2.1, `/help` command, and Flattener tool
+- **For Developers**: Code quality upgrades and snackbar notifications
+
+### What's New in 1.5.0 - Nov 19, 2023
 
 - **Continued Voice**: Engage with hands-free interaction for a seamless experience
 - **Visualization Tool**: Create data representations with our new visualization capabilities

docs/changelog.md

@@ -5,12 +5,22 @@ by release.
 
 - For the live roadmap, please see [the GitHub project](https://github.com/users/enricoros/projects/4/views/2)
 
-### 1.6.0 - Dec 2023
+### 1.7.0 - Dec 2023
 
 - work in progress: [big-AGI open roadmap](https://github.com/users/enricoros/projects/4/views/2), [help here](https://github.com/users/enricoros/projects/4/views/4)
-- milestone: [1.6.0](https://github.com/enricoros/big-agi/milestone/6)
+- milestone: [1.7.0](https://github.com/enricoros/big-agi/milestone/7)
 
-### ✨ What's New in 1.5.0 👊 - Nov 19, 2023
+### ✨ What's New in 1.6.0 👊 - Nov 28, 2023
+
+- **Web Browsing**: Download web pages within chats - [browsing guide](https://github.com/enricoros/big-agi/blob/main/docs/config-browse.md)
+- **Branching Discussions**: Create new conversations from any message
+- **Keyboard Navigation**: Swift chat navigation with new shortcuts (e.g. ctrl+alt+left/right)
+- **Performance Boost**: Faster rendering for a smoother experience
+- **UI Enhancements**: Refined interface based on user feedback
+- **New Features**: Anthropic Claude 2.1, `/help` command, and Flattener tool
+- **For Developers**: Code quality upgrades and snackbar notifications
+
+### What's New in 1.5.0 - Nov 19, 2023
 
 - **Continued Voice**: Engage with hands-free interaction for a seamless experience
 - **Visualization Tool**: Create data representations with our new visualization capabilities

package.json

@@ -1,6 +1,6 @@
 {
   "name": "big-agi",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "private": true,
   "scripts": {
     "dev": "next dev",

src/apps/chat/AppChat.tsx

@@ -245,7 +245,7 @@ export function AppChat() {
 
   const handleConversationExport = (conversationId: DConversationId | null) => setTradeConfig({ dir: 'export', conversationId });
 
-  const handleConversationBranch = React.useCallback((conversationId: DConversationId, messageId: string | null) => {
+  const handleConversationBranch = React.useCallback((conversationId: DConversationId, messageId: string | null): DConversationId | null => {
     showNextTitle.current = true;
     const branchedConversationId = branchConversation(conversationId, messageId);
     addSnackbar({
@@ -262,6 +262,7 @@ export function AppChat() {
       openSplitConversationId(branchedConversationId);
     else
       setFocusedConversationId(branchedConversationId);
+    return branchedConversationId;
   }, [branchConversation, openSplitConversationId, setFocusedConversationId]);
 
   const handleConversationFlatten = (conversationId: DConversationId) => setFlattenConversationId(conversationId);
@@ -426,10 +427,16 @@ export function AppChat() {
     {!!diagramConfig && <DiagramsModal config={diagramConfig} onClose={() => setDiagramConfig(null)} />}
 
     {/* Flatten */}
-    {!!flattenConversationId && <FlattenerModal conversationId={flattenConversationId} onClose={() => setFlattenConversationId(null)} />}
+    {!!flattenConversationId && (
+      <FlattenerModal
+        conversationId={flattenConversationId}
+        onConversationBranch={handleConversationBranch}
+        onClose={() => setFlattenConversationId(null)}
+      />
+    )}
 
     {/* Import / Export  */}
-    {!!tradeConfig && <TradeModal config={tradeConfig} onClose={() => setTradeConfig(null)} />}
+    {!!tradeConfig && <TradeModal config={tradeConfig} onConversationActivate={setFocusedConversationId} onClose={() => setTradeConfig(null)} />}
 
 
     {/* [confirmation] Reset Conversation */}

src/apps/chat/components/applayout/usePersonaDropdown.tsx

@@ -74,7 +74,7 @@ export function usePersonaIdDropdown(conversationId: DConversationId | null) {
             launchAppCall(conversationId, systemPurposeId);
         } : undefined}
       /> : null,
-    [conversationId, systemPurposeId],
+    [conversationId, labsCalling, systemPurposeId],
   );
 
   return { personaDropdown };

src/apps/chat/components/composer/Composer.tsx

@@ -15,6 +15,7 @@ import StopOutlinedIcon from '@mui/icons-material/StopOutlined';
 import TelegramIcon from '@mui/icons-material/Telegram';
 
 import type { ChatModeId } from '../../AppChat';
+import { getChatTimeoutMs } from '../../store-app-chat';
 
 import { CmdRunReact } from '~/modules/aifn/react/react';
 import { ContentReducer } from '~/modules/aifn/summarize/ContentReducer';
@@ -33,7 +34,6 @@ import { getClipboardItems, supportsClipboardRead } from '~/common/util/clipboar
 import { htmlTableToMarkdown } from '~/common/util/htmlTableToMarkdown';
 import { launchAppCall } from '~/common/app.routes';
 import { openLayoutPreferences } from '~/common/layout/store-applayout';
-import { pdfToText } from '~/common/util/pdfToText';
 import { playSoundUrl } from '~/common/util/audioUtils';
 import { useDebouncer } from '~/common/components/useDebouncer';
 import { useGlobalShortcut } from '~/common/components/useGlobalShortcut';
@@ -47,6 +47,7 @@ import { ButtonFileAttach } from './ButtonFileAttach';
 import { ChatModeMenu } from './ChatModeMenu';
 import { TokenBadge } from './TokenBadge';
 import { TokenProgressbar } from './TokenProgressbar';
+import { pdfToText } from '../attachments/pdfToText';
 import { useComposerStartupText } from './store-composer';
 
 
@@ -258,7 +259,7 @@ export function Composer(props: {
   }, [chatModeId, composeText, micContinuation, props, setComposeText]);
 
   const { isSpeechEnabled, isSpeechError, isRecordingAudio, isRecordingSpeech, toggleRecording } =
-    useSpeechRecognition(onSpeechResultCallback, 2000, 'm');
+    useSpeechRecognition(onSpeechResultCallback, getChatTimeoutMs() || 2000, 'm');
 
   const micIsRunning = !!speechInterimResult;
   const micContinuationTrigger = micContinuation && !micIsRunning && !assistantTyping;
@@ -498,7 +499,7 @@ export function Composer(props: {
         {/* Button column and composer Text (mobile: top, desktop: left and center) */}
         <Grid xs={12} md={9}><Stack direction='row' spacing={{ xs: 1, md: 2 }}>
 
-          {/* Vertical buttons */}
+          {/* Vertical (attach) buttons */}
           <Box sx={{ display: 'flex', flexDirection: 'column', gap: { xs: 0, md: 2 } }}>
 
             {/* [mobile] Mic button */}
@@ -515,9 +516,10 @@ export function Composer(props: {
 
           </Box>
 
-          {/* Edit box, with Drop overlay */}
+          {/* Edit box + mic buttons + overlays */}
           <Box sx={{ flexGrow: 1, position: 'relative' }}>
 
+            {/* Edit box with inner Token Progress bar */}
             <Box sx={{ position: 'relative' }}>
 
               <Textarea
@@ -549,10 +551,20 @@ export function Composer(props: {
                   lineHeight: 1.75,
                 }} />
 
-              {tokenLimit > 0 && (directTokens > 0 || (historyTokens + responseTokens) > 0) && <TokenProgressbar history={historyTokens} response={responseTokens} direct={directTokens} limit={tokenLimit} />}
+              {tokenLimit > 0 && (directTokens > 0 || (historyTokens + responseTokens) > 0) && (
+                <TokenProgressbar history={historyTokens} response={responseTokens} direct={directTokens} limit={tokenLimit} />
+              )}
+
+              {!!tokenLimit && (
+                <TokenBadge
+                  directTokens={directTokens} indirectTokens={historyTokens + responseTokens} tokenLimit={tokenLimit}
+                  showExcess absoluteBottomRight
+                />
+              )}
 
             </Box>
 
+            {/* Mic & Mic Continuation Buttons */}
             {isSpeechEnabled && (
               <Box sx={{
                 position: 'absolute', top: 0, right: 0,
@@ -571,13 +583,7 @@ export function Composer(props: {
               </Box>
             )}
 
-            {!!tokenLimit && (
-              <TokenBadge
-                directTokens={directTokens} indirectTokens={historyTokens + responseTokens} tokenLimit={tokenLimit}
-                showExcess absoluteBottomRight
-              />
-            )}
-
+            {/* overlay: Mic */}
             {micIsRunning && (
               <Card
                 color='primary' invertedColors variant='soft'
@@ -598,6 +604,7 @@ export function Composer(props: {
               </Card>
             )}
 
+            {/* overlay: Drag & Drop*/}
             <Card
               color='primary' invertedColors variant='soft'
               sx={{

src/apps/chat/components/composer/TokenBadge.tsx

@@ -68,7 +68,10 @@ export function TokenBadge({ directTokens, indirectTokens, tokenLimit, showExces
           <span>{value.toLocaleString()}</span>
         </Tooltip>
       }
-      sx={outerSx}
+      sx={{
+        ...outerSx,
+        cursor: 'help',
+      }}
       slotProps={{
         badge: {
           sx: innerSx,

src/apps/chat/store-app-chat.ts

@@ -22,6 +22,9 @@ interface AppChatStore {
   autoTitleChat: boolean;
   setAutoTitleChat: (autoTitleChat: boolean) => void;
 
+  micTimeoutMs: number;
+  setMicTimeoutMs: (micTimeoutMs: number) => void;
+
   showTextDiff: boolean;
   setShowTextDiff: (showTextDiff: boolean) => void;
 
@@ -46,6 +49,9 @@ const useAppChatStore = create<AppChatStore>()(persist(
     autoTitleChat: true,
     setAutoTitleChat: (autoTitleChat: boolean) => _set({ autoTitleChat }),
 
+    micTimeoutMs: 2000,
+    setMicTimeoutMs: (micTimeoutMs: number) => _set({ micTimeoutMs }),
+
     showTextDiff: false,
     setShowTextDiff: (showTextDiff: boolean) => _set({ showTextDiff }),
 
@@ -91,6 +97,12 @@ export const getChatAutoAI = (): {
   autoTitleChat: boolean,
 } => useAppChatStore.getState();
 
+export const getChatTimeoutMs = (): number =>
+  useAppChatStore.getState().micTimeoutMs;
+
+export const useChatMicTimeoutMs = (): [number, (micTimeoutMs: number) => void] =>
+  useAppChatStore(state => [state.micTimeoutMs, state.setMicTimeoutMs], shallow);
+
 export const useChatShowTextDiff = (): [boolean, (showDiff: boolean) => void] =>
   useAppChatStore(state => [state.showTextDiff, state.setShowTextDiff], shallow);
 

src/apps/link/ViewChatLink.tsx

@@ -57,8 +57,8 @@ export function ViewChatLink(props: { conversation: DConversation, storedAt: Dat
 
   const handleClone = async (canOverwrite: boolean) => {
     setCloning(true);
-    useChatStore.getState().importConversation({ ...props.conversation }, !canOverwrite);
-    await navigateToChat();
+    const importedId = useChatStore.getState().importConversation({ ...props.conversation }, !canOverwrite);
+    await navigateToChat(importedId);
     setCloning(false);
   };
 

src/apps/news/AppNews.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { keyframes } from '@emotion/react';
 
 import { Box, Button, Card, CardContent, Container, IconButton, Typography } from '@mui/joy';
 import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
@@ -10,6 +11,20 @@ import { capitalizeFirstLetter } from '~/common/util/textUtils';
 
 import { newsCallout, NewsItems } from './news.data';
 
+export const cssColorKeyframes = keyframes`
+    0%, 100% {
+        color: #636B74; /* Neutral main color (500) */
+    }
+    25% {
+        color: #12467B; /* Primary darker shade (700) */
+    }
+    50% {
+        color: #0B6BCB; /* Primary main color (500) */
+    }
+    75% {
+        color: #97C3F0; /* Primary lighter shade (300) */
+    }`;
+
 
 export function AppNews() {
   // state
@@ -36,11 +51,11 @@ export function AppNews() {
       }}>
 
         <Typography level='h1' sx={{ fontSize: '3rem' }}>
-          Welcome to {Brand.Title.Base} {firstNews?.versionName}!
+          Welcome to {Brand.Title.Base} <Box component='span' sx={{ animation: `${cssColorKeyframes} 10s infinite` }}>{firstNews?.versionName}</Box>!
         </Typography>
 
         <Typography>
-          {capitalizeFirstLetter(Brand.Title.Base)} has been updated to version {firstNews?.versionName}.
+          {capitalizeFirstLetter(Brand.Title.Base)} has been updated to version {firstNews?.versionName}
         </Typography>
 
         <Box>
@@ -69,7 +84,7 @@ export function AppNews() {
                 </Typography>}
 
                 {!!ni.items && (ni.items.length > 0) && <ul style={{ marginTop: 8, marginBottom: 8, paddingInlineStart: 24 }}>
-                  {ni.items.map((item, idx) => <li key={idx}>
+                  {ni.items.filter(item => item.dev !== true).map((item, idx) => <li key={idx}>
                     <Typography component='div'>
                       {item.text}
                     </Typography>