talksik/nirvana-v3
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

small ui adjustments

Browse Source
This commit is contained in:
talksik
2022-03-29 23:05:46 -04:00
parent 5113c9a697
commit cd7d78bcb8
6 changed files with 21 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/desktop/src/pages/Home/conversations/index.tsx
+14 -29
View File
@@ -1,7 +1,7 @@
import { Add, LinkRounded } from "@mui/icons-material";
import { Avatar, Tooltip } from "antd";
import { $selectedConversation } from "../../../controller/recoil";
import { Avatar } from "antd";
import { ContactDetails } from "@nirvana/core/responses/getContacts.response";
import { FaVolumeUp } from "react-icons/fa";
import SkeletonLoader from "../../../components/loading/skeleton";
@@ -33,51 +33,36 @@ export default function Conversations() {
return (
<>
{/* actions navbar */}
<div className="flex justify-end mx-10 mt-5 space-x-3">
<span className="hover:bg-slate-500 p-1 rounded-full cursor-pointer flex justify-center items-center">
<LinkRounded className="text-slate-100" fontSize="small" />
</span>
<span className="hover:bg-slate-500 p-1 rounded-full cursor-pointer flex justify-center items-center">
<Add className="text-slate-100" fontSize="small" />
</span>
</div>
{/* pinned conversations */}
<div className="m-5 p-4 bg-slate-500 shadow-lg rounded">
<span className="flex flex-row justify-start items-center">
<FaVolumeUp className="text-red-500" />
<span className="ml-2 tracking-wider text-slate-100 uppercase text-sm font-semibold">
Live
<Tooltip title="Listen in like a walkie-talkie.">
<span className="flex flex-row justify-start items-center cursor-pointer">
<FaVolumeUp className="text-red-500" />
<span className="ml-2 tracking-wider text-slate-100 uppercase text-sm font-semibold">
Live
</span>
</span>
</span>
<span className="text-slate-300">
Mark Conversations as Pinned to Hear Them Live
</span>
</Tooltip>
</div>
{isLoading ? (
<SkeletonLoader />
) : (
<div className="flex flex-col m-5 p-4">
<span className="flex flex-row justify-start items-center mb-2">
<span className="ml-2 tracking-wider text-slate-100 uppercase text-sm font-semibold">
Inbox
</span>
</span>
{contactDetailsListResponse?.contactsDetails.map(
(contactDetail: ContactDetails) => {
const isSelected =
contactDetail.otherUser.googleId === selectedConvo;
return (
<div
key={contactDetail.relationship._id.toString()}
onClick={() =>
selectContact(contactDetail.otherUser.googleId)
}
className="flex flex-row items-center hover:bg-slate-600 group border-t border-t-slate-500
py-4 px-2 cursor-pointer"
className={`flex flex-row items-center hover:bg-slate-600 group py-4 px-2 cursor-pointer ${
isSelected ? "bg-slate-600" : ""
} rounded`}
>
<UserAvatarWithStatus user={contactDetail.otherUser} />