on master help sign in
components/Contact: change UC CTA to group link
66dfbbaMatilde Park
components/Contact.js+5−67
@@ -1,62 +1,10 @@
1import NewsletterSignup from "./NewletterSignup";
1import NewsletterSignup from "./NewletterSignup";
2import { name, contact } from "../lib/constants";
2import { name, contact } from "../lib/constants";
3−import { useCopyToClipboard } from "../lib/hooks";
3+import Link from "next/link";
4
4
5export default function Contact({ emphasize }) {
5export default function Contact({ emphasize }) {
6− const [copyStatus, copy] = useCopyToClipboard(contact.urbitCommunity);
7−
8 const linkText = emphasize ? "text-green-400" : "text-wall-600";
6 const linkText = emphasize ? "text-green-400" : "text-wall-600";
9 const border = emphasize ? "border-green-400" : "border-wall-600";
7 const border = emphasize ? "border-green-400" : "border-wall-600";
10− const washedBg = emphasize ? "bg-green-100" : "bg-wall-100";
11− const iconColor = emphasize ? "#00B171" : "#24221E";
12−
13− const buttonIcon =
14− copyStatus === "inactive" ? (
15− <svg
16− width="16"
17− height="16"
18− viewBox="0 0 16 16"
19− fill="none"
20− xmlns="http://www.w3.org/2000/svg"
21− >
22− <path
23− fillRule="evenodd"
24− clipRule="evenodd"
25− d="M3.2 1.6C3.2 0.716344 3.91634 0 4.8 0H11.3615L14.9333 2.38124V12.2667C14.9333 13.1503 14.217 13.8667 13.3333 13.8667H12.8V14.4C12.8 15.2837 12.0837 16 11.2 16H2.66667C1.78301 16 1.06667 15.2837 1.06667 14.4V3.73333C1.06667 2.84968 1.78301 2.13333 2.66667 2.13333H3.2V1.6ZM3.2 3.2H2.66667C2.37211 3.2 2.13333 3.43878 2.13333 3.73333V14.4C2.13333 14.6946 2.37211 14.9333 2.66667 14.9333H11.2C11.4946 14.9333 11.7333 14.6946 11.7333 14.4V13.8667H4.8C3.91634 13.8667 3.2 13.1503 3.2 12.2667V3.2Z"
26− fill={iconColor}
27− />
28− </svg>
29− ) : copyStatus === "copied" ? (
30− <svg
31− width="16"
32− height="16"
33− viewBox="0 0 16 16"
34− fill="none"
35− xmlns="http://www.w3.org/2000/svg"
36− >
37− <path
38− fillRule="evenodd"
39− clipRule="evenodd"
40− d="M0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8ZM7.54325 11.4247L12.1498 5.66647L11.3169 5.00013L7.39013 9.90859L4.60812 7.59025L3.92526 8.40969L7.54325 11.4247Z"
41− fill={iconColor}
42− />
43− </svg>
44− ) : (
45− <svg
46− width="16"
47− height="16"
48− viewBox="0 0 16 16"
49− fill="none"
50− xmlns="http://www.w3.org/2000/svg"
51− >
52− <path
53− fillRule="evenodd"
54− clipRule="evenodd"
55− d="M0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8ZM10.8229 11.5772L8.00004 8.75429L5.17716 11.5772L4.42292 10.8229L7.24579 8.00004L4.42292 5.17716L5.17716 4.42292L8.00004 7.24579L10.8229 4.42292L11.5772 5.17716L8.75429 8.00004L11.5772 10.8229L10.8229 11.5772Z"
56− fill={iconColor}
57− />
58− </svg>
59− );
60
8
61 return (
9 return (
62 <div>
10 <div>
@@ -79,21 +27,11 @@ export default function Contact({ emphasize }) {
79 Github
27 Github
80 </a>
28 </a>
81 </h4>
29 </h4>
82− <h4 className="mt-4 text-wall-500 flex items-baseline flex-wrap">
30+ <h4 className="mt-6 text-wall-500 flex-wrap">
83 Boot Urbit and join{" "}
31 Boot Urbit and join{" "}
84− <div className="md:ml-2 rounded-lg flex items-stretch">
85− <code
86− className={`rounded-l-lg px-2 md:px-4 py-2 ${washedBg} flex items-center h-full ${linkText}`}
87− >
88− {contact.urbitCommunity}
32+ <Link href={`/groups/${contact.urbitCommunity}`}>
89− </code>
33+ <a className={linkText}>Urbit Community</a>
90− <button
34+ </Link>
91− className={`rounded-r-lg px-4 ml-0.5 flex-1 flex justify-center items-center ${washedBg}`}
92− onClick={() => copy()}
93− >
94− {buttonIcon}
95− </button>
96− </div>
97 </h4>
35 </h4>
98 </div>
36 </div>
99 );
37 );