mokhtar/shellphone.app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

back button stuff

Browse Source
This commit is contained in:
m5r 2022-06-06 00:35:09 +02:00
parent 1425a72d39
commit c047e169f2
2 changed files with 4 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
app/routes/__app/messages.$recipient.tsx
View File

@ -1,5 +1,5 @@
import type { MetaFunction } from "@remix-run/node"; import type { MetaFunction } from "@remix-run/node";
import { Link, useNavigate, useParams } from "@remix-run/react"; import { Link, useParams } from "@remix-run/react";
import { useLoaderData } from "superjson-remix"; import { useLoaderData } from "superjson-remix";
import { IoCall, IoChevronBack } from "react-icons/io5"; import { IoCall, IoChevronBack } from "react-icons/io5";
@ -23,7 +23,6 @@ export const action = conversationAction;
export const loader = conversationLoader; export const loader = conversationLoader;
export default function ConversationPage() { export default function ConversationPage() {
const navigate = useNavigate();
const params = useParams<{ recipient: string }>(); const params = useParams<{ recipient: string }>();
const recipient = decodeURIComponent(params.recipient ?? ""); const recipient = decodeURIComponent(params.recipient ?? "");
const { conversation } = useLoaderData<ConversationLoaderData>(); const { conversation } = useLoaderData<ConversationLoaderData>();
@ -31,9 +30,9 @@ export default function ConversationPage() {
return ( return (
<section className="h-full"> <section className="h-full">
<header className="absolute top-0 w-screen h-12 backdrop-filter backdrop-blur-sm bg-white bg-opacity-75 border-b items-center flex justify-between"> <header className="absolute top-0 w-screen h-12 backdrop-filter backdrop-blur-sm bg-white bg-opacity-75 border-b items-center flex justify-between">
<span className="pl-2 cursor-pointer" onClick={() => navigate(-1)}> <Link className="pl-2 cursor-pointer" to="/messages">
<IoChevronBack className="h-6 w-6" /> <IoChevronBack className="h-6 w-6" />
</span> </Link>
<strong className="absolute right-0 left-0 text-center pointer-events-none"> <strong className="absolute right-0 left-0 text-center pointer-events-none">
{conversation?.formattedPhoneNumber ?? recipient} {conversation?.formattedPhoneNumber ?? recipient}
</strong> </strong>

13
app/routes/__app/settings.tsx
View File

@ -1,8 +1,7 @@
import type { MetaFunction } from "@remix-run/node"; import type { MetaFunction } from "@remix-run/node";
import { Link, NavLink, Outlet, useNavigate } from "@remix-run/react"; import { Link, NavLink, Outlet } from "@remix-run/react";
import clsx from "clsx"; import clsx from "clsx";
import { import {
IoChevronBack,
IoLogOutOutline, IoLogOutOutline,
IoNotificationsOutline, IoNotificationsOutline,
IoCardOutline, IoCardOutline,
@ -27,18 +26,8 @@ export const meta: MetaFunction = () => ({
}); });
export default function SettingsLayout() { export default function SettingsLayout() {
const navigate = useNavigate();
return ( return (
<section> <section>
<header className="bg-gray-100 px-2 sm:px-6 lg:px-8">
<header className="flex">
<span className="flex items-center cursor-pointer" onClick={() => navigate(-1)}>
<IoChevronBack className="h-8 w-8 mr-2" /> Back
</span>
</header>
</header>
<main className="flex flex-col flex-grow mx-auto w-full max-w-7xl pb-10 lg:py-12 lg:px-8"> <main className="flex flex-col flex-grow mx-auto w-full max-w-7xl pb-10 lg:py-12 lg:px-8">
<div className="flex flex-col flex-grow lg:grid lg:grid-cols-12 lg:gap-x-5"> <div className="flex flex-col flex-grow lg:grid lg:grid-cols-12 lg:gap-x-5">
<aside className="py-6 px-2 sm:px-6 lg:py-0 lg:px-0 lg:col-span-3"> <aside className="py-6 px-2 sm:px-6 lg:py-0 lg:px-0 lg:col-span-3">