replace useRouter().params with useParam()

This commit is contained in:
m5r 2021-10-24 17:42:48 +02:00
parent 3edf0cb471
commit 1d59a74002
3 changed files with 10 additions and 11 deletions

View File

@ -1,15 +1,14 @@
import { Suspense, useEffect, useMemo, useRef } from "react";
import { useRouter } from "blitz";
import { useParam } from "blitz";
import clsx from "clsx";
import { Direction } from "../../../db";
import { Direction } from "db";
import useConversation from "../hooks/use-conversation";
import NewMessageArea from "./new-message-area";
import { formatDate, formatTime } from "../../core/helpers/date-formatter";
import { formatDate, formatTime } from "app/core/helpers/date-formatter";
export default function Conversation() {
const router = useRouter();
const recipient = decodeURIComponent(router.params.recipient);
const recipient = decodeURIComponent(useParam("recipient", "string") ?? "");
const conversation = useConversation(recipient)[0];
const messages = useMemo(() => conversation?.messages ?? [], [conversation?.messages]);
const messagesListRef = useRef<HTMLUListElement>(null);

View File

@ -1,6 +1,6 @@
import { Suspense } from "react";
import type { BlitzPage } from "blitz";
import { Routes, useRouter } from "blitz";
import { Routes, useParam, useRouter } from "blitz";
import { IoChevronBack, IoInformationCircle, IoCall } from "react-icons/io5";
import AppLayout from "../../../core/layouts/layout";
@ -9,7 +9,7 @@ import useConversation from "../../hooks/use-conversation";
const ConversationPage: BlitzPage = () => {
const router = useRouter();
const recipient = decodeURIComponent(router.params.recipient);
const recipient = decodeURIComponent(useParam("recipient", "string") ?? "");
const pageTitle = `Messages with ${recipient}`;
const conversation = useConversation(recipient)[0];

View File

@ -1,6 +1,7 @@
import type { BlitzPage, ErrorFallbackProps, WithRouterProps } from "blitz";
import { ErrorBoundary, Routes, useRouter, withRouter } from "blitz";
import { useCallback, useEffect } from "react";
import type { WithRouterProps } from "next/dist/client/with-router";
import type { BlitzPage, ErrorFallbackProps } from "blitz";
import { ErrorBoundary, Routes, useParam, withRouter } from "blitz";
import type { TwilioError } from "@twilio/voice-sdk";
import { atom, useAtom } from "jotai";
import { IoCall } from "react-icons/io5";
@ -12,8 +13,7 @@ import Keypad from "../../components/keypad";
const OutgoingCall: BlitzPage = () => {
const [phoneNumber, setPhoneNumber] = useAtom(phoneNumberAtom);
const router = useRouter();
const recipient = decodeURIComponent(router.params.recipient);
const recipient = decodeURIComponent(useParam("recipient", "string") ?? "");
const onHangUp = useCallback(() => setPhoneNumber(""), [setPhoneNumber]);
const call = useMakeCall({ recipient, onHangUp });
const { isDeviceReady } = useDevice();