("");
+
const selectSearch = () => {
inputRef.current?.focus();
};
+ const updateInput = (e) => {
+ const newSearchInput = e.target.value;
+ setSearchInput(newSearchInput);
+
+ if (!newSearchInput) {
+ router.query.q = undefined;
+ } else {
+ // update url => initiates the search
+ router.query.q = encodeURI(newSearchInput);
+ }
+
+ router.push({
+ query: { q: encodeURI(newSearchInput) },
+ });
+ };
+
const keyMap: KeyMap = {
SELECT_SEARCH: {
name: "select search to start searching",
@@ -88,8 +108,10 @@ export default function Header() {
diff --git a/packages/web/components/v2/SearchResults.tsx b/packages/web/components/v2/SearchResults.tsx
new file mode 100644
index 0000000..65a2c78
--- /dev/null
+++ b/packages/web/components/v2/SearchResults.tsx
@@ -0,0 +1,13 @@
+import { useRouter } from "next/router";
+
+export default function SearchResults() {
+ const router = useRouter();
+
+ const q = router.query.q;
+
+ return (
+
+ 0 results for {`"${q}"`}
+
+ );
+}
diff --git a/packages/web/pages/s/index.tsx b/packages/web/pages/s/index.tsx
index ebb8aac..33365a0 100644
--- a/packages/web/pages/s/index.tsx
+++ b/packages/web/pages/s/index.tsx
@@ -17,6 +17,7 @@ import {
import CreateConversation from "../../components/v2/CreateConversation";
import { FaArrowLeft } from "react-icons/fa";
import KeyboardShortcutHandler from "../../components/v2/KeyboardShortcutHandler";
+import SearchResults from "../../components/v2/SearchResults";
export default function Me() {
// figure out what content to render from here
@@ -61,6 +62,8 @@ export default function Me() {
var fullCleanPageContent: ReactElement = undefined;
if (currRoute === Routes.createConvo) {
fullCleanPageContent = ;
+ } else if (router.query.q) {
+ fullCleanPageContent = ;
}
if (fullCleanPageContent) {
@@ -82,6 +85,7 @@ export default function Me() {
+
{fullCleanPageContent}
);