github/plane
0
0
Fork 1
mirror of https://github.com/makeplane/plane synced 2024-06-14 14:31:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: ui bug (#274)

Browse Source 
* fix: shortcut search fix
shortcut modal ui fixes
shortcut search fix
email us label change
* fix: email us label updated
This commit is contained in:
Anmol Singh Bhatia 2023-02-13 20:19:46 +05:30 committed by GitHub
parent 214e860e67
commit c6f0990605
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 46 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

65
apps/app/components/command-palette/shortcuts-modal.tsx
View File

@ -1,4 +1,4 @@
import React, { useState } from "react"; import React, { useEffect, useState } from "react";
// headless ui // headless ui
import { Dialog, Transition } from "@headlessui/react"; import { Dialog, Transition } from "@headlessui/react";
// icons // icons
@ -15,7 +15,7 @@ const shortcuts = [
{ {
title: "Navigation", title: "Navigation",
shortcuts: [ shortcuts: [
{ keys: "Ctrl,Cmd,K", description: "To open navigator" }, { keys: "Ctrl,/,Cmd,K", description: "To open navigator" },
{ keys: "↑", description: "Move up" }, { keys: "↑", description: "Move up" },
{ keys: "↓", description: "Move down" }, { keys: "↓", description: "Move down" },
{ keys: "←", description: "Move left" }, { keys: "←", description: "Move left" },
@ -34,22 +34,26 @@ const shortcuts = [
{ keys: "Delete", description: "To bulk delete issues" }, { keys: "Delete", description: "To bulk delete issues" },
{ keys: "H", description: "To open shortcuts guide" }, { keys: "H", description: "To open shortcuts guide" },
{ {
keys: "Ctrl,Cmd,Alt,C", keys: "Ctrl,/,Cmd,Alt,C",
description: "To copy issue url when on issue detail page.", description: "To copy issue url when on issue detail page.",
}, },
], ],
}, },
]; ];
const allShortcuts = shortcuts.map((i) => i.shortcuts).flat(1);
export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => { export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
const [query, setQuery] = useState(""); const [query, setQuery] = useState("");
const filteredShortcuts = shortcuts.filter((shortcut) => const filteredShortcuts = allShortcuts.filter((shortcut) =>
shortcut.shortcuts.some((item) => item.description.includes(query.trim())) || query === "" shortcut.description.includes(query.trim()) || query === "" ? true : false
? true
: false
); );
useEffect(() => {
if (!isOpen) setQuery("");
}, [isOpen]);
return ( return (
<Transition.Root show={isOpen} as={React.Fragment}> <Transition.Root show={isOpen} as={React.Fragment}>
<Dialog as="div" className="relative z-20" onClose={setIsOpen}> <Dialog as="div" className="relative z-20" onClose={setIsOpen}>
@ -104,8 +108,40 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
/> />
</div> </div>
<div className="flex w-full flex-col gap-y-3"> <div className="flex w-full flex-col gap-y-3">
{filteredShortcuts.length > 0 ? ( {query.trim().length > 0 ? (
filteredShortcuts.map(({ title, shortcuts }) => ( filteredShortcuts.length > 0 ? (
filteredShortcuts.map((shortcut) => (
<div key={shortcut.keys} className="flex w-full flex-col">
<div className="flex flex-col gap-y-3">
<div className="flex justify-between">
<p className="text-sm text-gray-500">{shortcut.description}</p>
<div className="flex items-center gap-x-1">
{shortcut.keys.split(",").map((key, index) => (
<span key={index} className="flex items-center gap-1">
<kbd className="rounded bg-gray-200 px-1 text-sm">
{key}
</kbd>
</span>
))}
</div>
</div>
</div>
</div>
))
) : (
<div className="flex flex-col gap-y-3">
<p className="text-sm text-gray-500">
No shortcuts found for{" "}
<span className="font-semibold italic">
{`"`}
{query}
{`"`}
</span>
</p>
</div>
)
) : (
shortcuts.map(({ title, shortcuts }) => (
<div key={title} className="flex w-full flex-col"> <div key={title} className="flex w-full flex-col">
<p className="mb-4 font-medium">{title}</p> <p className="mb-4 font-medium">{title}</p>
<div className="flex flex-col gap-y-3"> <div className="flex flex-col gap-y-3">
@ -126,17 +162,6 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
</div> </div>
</div> </div>
)) ))
) : (
<div className="flex flex-col gap-y-3">
<p className="text-sm text-gray-500">
No shortcuts found for{" "}
<span className="font-semibold italic">
{`"`}
{query}
{`"`}
</span>
</p>
</div>
)} )}
</div> </div>
</div> </div>

2
apps/app/components/workspace/help-section.tsx
View File

@ -32,7 +32,7 @@ const helpOptions = [
Icon: GithubIcon, Icon: GithubIcon,
}, },
{ {
name: "Chat with us", name: "Email us",
href: "mailto:hello@plane.so", href: "mailto:hello@plane.so",
Icon: CommentIcon, Icon: CommentIcon,
}, },