[Query Copilot] Sample Prompt implementation and other (#1489)

* Sample Prompts and ComboBox implementation

* Adding DeletePopup and SamplePrompts

* Implementation of Delete/Copy code buttons

* Adjusted changes based on the comments for Modal

* Reverded implementation of inline prompt

* Updated function

* Replacing const to function

* Unused icons deleted

* Comments removed

* Additional styling based on designs

* Test snapshots

* Implementation of popup for copying code

* Tests updated/added

* Background color changed

* Resolving lint issue

* CopyPopup snapshot updated

* Merged with master

* Implementations fixed based on comments

* Test Snapshots updated

* Query copilot updated

* Resolving minor bug with Delete popup

---------

Co-authored-by: Predrag Klepic <v-prklepic@microsoft.com>

src/Explorer/QueryCopilot/Popup/CopyPopup.tsx

@@ -0,0 +1,63 @@
+import { IconButton, Image, Stack, Text } from "@fluentui/react";
+import React, { Dispatch, SetStateAction } from "react";
+import Success from "../../../../images/successfulPopup.svg";
+
+export const CopyPopup = ({
+  showCopyPopup,
+  setShowCopyPopup,
+}: {
+  showCopyPopup: boolean;
+  setShowCopyPopup: Dispatch<SetStateAction<boolean>>;
+}): JSX.Element => {
+  const closePopup = () => {
+    setShowCopyPopup(false);
+  };
+
+  return showCopyPopup ? (
+    <Stack
+      style={{
+        position: "fixed",
+        width: 345,
+        height: 66,
+        padding: 10,
+        gap: 5,
+        top: 75,
+        right: 20,
+        background: "#FFFFFF",
+        boxShadow: "0 2px 6px rgba(0, 0, 0, 0.16)",
+      }}
+    >
+      <Stack
+        horizontal
+        verticalAlign="center"
+        style={{ display: "flex", justifyContent: "space-between", padding: "5px, 2px, 0px, 0px" }}
+      >
+        <Stack horizontal verticalAlign="center" style={{ display: "flex", gap: 10 }}>
+          <Image style={{ width: 15, height: 15 }} src={Success} />
+          <Text>
+            <b>Code copied successfully</b>
+          </Text>
+        </Stack>
+        <IconButton
+          styles={{
+            root: {
+              border: "none",
+              backgroundColor: "transparent",
+              padding: 0,
+              selectors: {
+                "&:focus": {
+                  outline: "none",
+                },
+              },
+            },
+          }}
+          iconProps={{ iconName: "Cancel" }}
+          onClick={closePopup}
+        />
+      </Stack>
+      <Text style={{ marginTop: -10 }}>The query has been copied to the clipboard</Text>
+    </Stack>
+  ) : (
+    <></>
+  );
+};