Fix connection strings

src/Explorer/Panes/SettingsPane/SettingsPane.tsx

@@ -234,7 +234,7 @@ export const SettingsPane: FunctionComponent<{ explorer: Explorer }> = ({
   const handleSampleDatabaseChange = async (ev: React.MouseEvent<HTMLElement>, checked?: boolean): Promise<void> => {
     setCopilotSampleDBEnabled(checked);
     useQueryCopilot.getState().setCopilotSampleDBEnabled(checked);
-    setRefreshExplorer(false);
+    setRefreshExplorer(!refreshExplorer);
   };
 
   const choiceButtonStyles = {

src/Explorer/QueryCopilot/QueryCopilotContext.tsx

@@ -30,7 +30,6 @@ const CopilotProvider = ({ children }: { children: React.ReactNode }): JSX.Eleme
       queryResults: undefined,
       errorMessage: "",
       isSamplePromptsOpen: false,
-      showPromptTeachingBubble: true,
       showDeletePopup: false,
       showFeedbackBar: false,
       showCopyPopup: false,
@@ -66,7 +65,6 @@ const CopilotProvider = ({ children }: { children: React.ReactNode }): JSX.Eleme
       setQueryResults: (queryResults: QueryResults | undefined) => set({ queryResults }),
       setErrorMessage: (errorMessage: string) => set({ errorMessage }),
       setIsSamplePromptsOpen: (isSamplePromptsOpen: boolean) => set({ isSamplePromptsOpen }),
-      setShowPromptTeachingBubble: (showPromptTeachingBubble: boolean) => set({ showPromptTeachingBubble }),
       setShowDeletePopup: (showDeletePopup: boolean) => set({ showDeletePopup }),
       setShowFeedbackBar: (showFeedbackBar: boolean) => set({ showFeedbackBar }),
       setshowCopyPopup: (showCopyPopup: boolean) => set({ showCopyPopup }),
@@ -105,7 +103,6 @@ const CopilotProvider = ({ children }: { children: React.ReactNode }): JSX.Eleme
           queryResults: undefined,
           errorMessage: "",
           isSamplePromptsOpen: false,
-          showPromptTeachingBubble: true,
           showDeletePopup: false,
           showFeedbackBar: false,
           showCopyPopup: false,

src/Explorer/QueryCopilot/QueryCopilotPromptbar.tsx

@@ -18,6 +18,7 @@ import {
   Text,
   TextField,
 } from "@fluentui/react";
+import { useBoolean } from "@fluentui/react-hooks";
 import { HttpStatusCodes } from "Common/Constants";
 import { handleError } from "Common/ErrorHandlingUtils";
 import { createUri } from "Common/UrlUtility";
@@ -70,7 +71,7 @@ export const QueryCopilotPromptbar: React.FC<QueryCopilotPromptProps> = ({
   databaseId,
   containerId,
 }: QueryCopilotPromptProps): JSX.Element => {
-  const [copilotTeachingBubbleVisible, setCopilotTeachingBubbleVisible] = useState<boolean>(false);
+  const [copilotTeachingBubbleVisible, { toggle: toggleCopilotTeachingBubbleVisible }] = useBoolean(false);
   const inputEdited = useRef(false);
   const {
     openFeedbackModal,
@@ -93,8 +94,6 @@ export const QueryCopilotPromptbar: React.FC<QueryCopilotPromptProps> = ({
     setIsSamplePromptsOpen,
     showSamplePrompts,
     setShowSamplePrompts,
-    showPromptTeachingBubble,
-    setShowPromptTeachingBubble,
     showDeletePopup,
     setShowDeletePopup,
     showFeedbackBar,
@@ -273,23 +272,16 @@ export const QueryCopilotPromptbar: React.FC<QueryCopilotPromptProps> = ({
   };
 
   const showTeachingBubble = (): void => {
-    if (showPromptTeachingBubble && !inputEdited.current) {
+    if (!inputEdited.current) {
       setTimeout(() => {
         if (!inputEdited.current && !isWelcomModalVisible()) {
-          setCopilotTeachingBubbleVisible(true);
+          toggleCopilotTeachingBubbleVisible();
           inputEdited.current = true;
         }
       }, 30000);
-    } else {
-      toggleCopilotTeachingBubbleVisible(false);
     }
   };
 
-  const toggleCopilotTeachingBubbleVisible = (visible: boolean): void => {
-    setCopilotTeachingBubbleVisible(visible);
-    setShowPromptTeachingBubble(visible);
-  };
-
   const isWelcomModalVisible = (): boolean => {
     return localStorage.getItem("hideWelcomeModal") !== "true";
   };
@@ -372,13 +364,13 @@ export const QueryCopilotPromptbar: React.FC<QueryCopilotPromptProps> = ({
           placeholder="Ask a question in natural language and we’ll generate the query for you."
           aria-labelledby="copilot-textfield-label"
         />
-        {showPromptTeachingBubble && copilotTeachingBubbleVisible && (
+        {copilotTeachingBubbleVisible && (
           <TeachingBubble
             calloutProps={{ directionalHint: DirectionalHint.bottomCenter }}
             target="#naturalLanguageInput"
             hasCloseButton={true}
             closeButtonAriaLabel="Close"
-            onDismiss={() => toggleCopilotTeachingBubbleVisible(false)}
+            onDismiss={toggleCopilotTeachingBubbleVisible}
             hasSmallHeadline={true}
             headline="Write a prompt"
           >
@@ -386,7 +378,7 @@ export const QueryCopilotPromptbar: React.FC<QueryCopilotPromptProps> = ({
             <Link
               onClick={() => {
                 setShowSamplePrompts(true);
-                toggleCopilotTeachingBubbleVisible(false);
+                toggleCopilotTeachingBubbleVisible();
               }}
               style={{ color: "white", fontWeight: 600 }}
             >

src/Explorer/SplashScreen/SplashScreen.tsx

@@ -148,7 +148,7 @@ export class SplashScreen extends React.Component<SplashScreenProps> {
             />
           </Stack>
           <Stack horizontal tokens={{ childrenGap: 16 }}>
-            {useQueryCopilot.getState().copilotEnabled && (
+            {useQueryCopilot.getState().copilotEnabled && useQueryCopilot.getState().copilotSampleDBEnabled && (
               <SplashScreenButton
                 imgSrc={CopilotIcon}
                 title={"Query faster with Copilot"}

src/Explorer/Tabs/PostgresConnectTab.tsx

@@ -20,6 +20,7 @@ export const PostgresConnectTab: React.FC = (): JSX.Element => {
   const [usePgBouncerPort, setUsePgBouncerPort] = React.useState<boolean>(false);
   const [selectedNode, setSelectedNode] = React.useState<string>(nodes?.[0]?.value);
   const portNumber = usePgBouncerPort ? "6432" : "5432";
+  const dbName = databaseName ? databaseName : "citus";
 
   const onCopyBtnClicked = (selector: string): void => {
     const textfield: HTMLInputElement = document.querySelector(selector);
@@ -40,11 +41,11 @@ export const PostgresConnectTab: React.FC = (): JSX.Element => {
     text: node.text,
   }));
 
-  const postgresSQLConnectionURL = `postgres://${adminLogin}:{your_password}@${selectedNode}:${portNumber}/${databaseName}?sslmode=require`;
+  const postgresSQLConnectionURL = `postgres://${adminLogin}:{your_password}@${selectedNode}:${portNumber}/${dbName}?sslmode=require`;
-  const psql = `psql "host=${selectedNode} port=${portNumber} dbname=${databaseName} user=${adminLogin} password={your_password} sslmode=require"`;
+  const psql = `psql "host=${selectedNode} port=${portNumber} dbname=${dbName} user=${adminLogin} password={your_password} sslmode=require"`;
-  const jdbc = `jdbc:postgresql://${selectedNode}:${portNumber}/${databaseName}?user=${adminLogin}&password={your_password}&sslmode=require`;
+  const jdbc = `jdbc:postgresql://${selectedNode}:${portNumber}/${dbName}?user=${adminLogin}&password={your_password}&sslmode=require`;
-  const libpq = `host=${selectedNode} port=${portNumber} dbname=${databaseName} user=${adminLogin} password={your_password} sslmode=require`;
+  const libpq = `host=${selectedNode} port=${portNumber} dbname=${dbName} user=${adminLogin} password={your_password} sslmode=require`;
-  const adoDotNet = `Server=${selectedNode};Database=${databaseName};Port=${portNumber};User Id=${adminLogin};Password={your_password};Ssl Mode=Require;`;
+  const adoDotNet = `Server=${selectedNode};Database=${dbName};Port=${portNumber};User Id=${adminLogin};Password={your_password};Ssl Mode=Require;`;
 
   return (
     <div style={{ width: "100%", padding: 16 }}>

src/hooks/useQueryCopilot.ts

@@ -29,7 +29,6 @@ export interface QueryCopilotState {
   queryResults: QueryResults | undefined;
   errorMessage: string;
   isSamplePromptsOpen: boolean;
-  showPromptTeachingBubble: boolean;
   showDeletePopup: boolean;
   showFeedbackBar: boolean;
   showCopyPopup: boolean;
@@ -72,7 +71,6 @@ export interface QueryCopilotState {
   setQueryResults: (queryResults: QueryResults | undefined) => void;
   setErrorMessage: (errorMessage: string) => void;
   setIsSamplePromptsOpen: (isSamplePromptsOpen: boolean) => void;
-  setShowPromptTeachingBubble: (showPromptTeachingBubble: boolean) => void;
   setShowDeletePopup: (showDeletePopup: boolean) => void;
   setShowFeedbackBar: (showFeedbackBar: boolean) => void;
   setshowCopyPopup: (showCopyPopup: boolean) => void;
@@ -95,7 +93,7 @@ export interface QueryCopilotState {
   resetQueryCopilotStates: () => void;
 }
 
-type QueryCopilotStore = UseStore<Partial<QueryCopilotState>>;
+type QueryCopilotStore = UseStore<QueryCopilotState>;
 
 export const useQueryCopilot: QueryCopilotStore = create((set) => ({
   copilotEnabled: false,