chore: 2.55.0 release

.env

@@ -6,7 +6,6 @@ NEXT_PUBLIC_POSTHOG_ID=phc_Y0xz6nK55MEwWjobJsI2P8rsiomZJ6eZLoXehmMy9tt
 NEXT_PUBLIC_CLOUD_NAME=dgxgziswe
 NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=test
 NEXT_PUBLIC_STRIPE_SUB_CANCEL_URL=https://billing.stripe.com/p/login/test_bIY8xy3iy6fpeHu3cc
-NEXT_PUBLIC_OPENGRAPH_URL=https://beta.opengraph.opensauced.pizza/v1
 SENTRY_DSN=https://3f5bb9023ff0407299dd22a6454558f9@o4504872488927232.ingest.sentry.io/4505082236960768
 NEXT_PUBLIC_SENTRY_DSN=https://3f5bb9023ff0407299dd22a6454558f9@o4504872488927232.ingest.sentry.io/4505082236960768
 

CHANGELOG.md

@@ -5,6 +5,28 @@
 
 > All notable changes to this project will be documented in this file
 
+## [2.55.0-beta.2](https://github.com/open-sauced/app/compare/v2.55.0-beta.1...v2.55.0-beta.2) (2024-08-12)
+
+
+### 🐛 Bug Fixes
+
+* re-enable newsletter form on Netlify ([#3919](https://github.com/open-sauced/app/issues/3919)) ([42e2668](https://github.com/open-sauced/app/commit/42e266808a1d3e859ca0d7070fa586d4bb344afd))
+* toggling hide bots for yolo coders no longer causes page jumps ([#3911](https://github.com/open-sauced/app/issues/3911)) ([4337ec3](https://github.com/open-sauced/app/commit/4337ec3cf4f04638ecd1a127803b4d0f258d77ac))
+
+## [2.55.0-beta.1](https://github.com/open-sauced/app/compare/v2.54.1-beta.1...v2.55.0-beta.1) (2024-08-12)
+
+
+### 🍕 Features
+
+* added a link to OSCR tooltips pointing to the OSCR docs ([#3921](https://github.com/open-sauced/app/issues/3921)) ([71e8b4a](https://github.com/open-sauced/app/commit/71e8b4ac419168d17e069fb17b5be790c66d87a3))
+
+## [2.54.1-beta.1](https://github.com/open-sauced/app/compare/v2.54.0...v2.54.1-beta.1) (2024-08-12)
+
+
+### 🤖 Build System
+
+* remove OpenGraph service environment variable ([#3915](https://github.com/open-sauced/app/issues/3915)) ([7c57ef0](https://github.com/open-sauced/app/commit/7c57ef0edb908dc158c5758bb034a1c6032f11c3))
+
 ## [2.54.0](https://github.com/open-sauced/app/compare/v2.53.0...v2.54.0) (2024-08-12)
 
 

components/Contributors/Oscr.tsx

@@ -1,6 +1,7 @@
 import { LockIcon } from "@primer/octicons-react";
 import { usePostHog } from "posthog-js/react";
 import { useRouter } from "next/router";
+import { HiOutlineInformationCircle } from "react-icons/hi";
 import Pill from "components/atoms/Pill/pill";
 import Tooltip from "components/atoms/Tooltip/tooltip";
 import Button from "components/shared/Button/button";
@@ -83,3 +84,26 @@ export const OscrButton = ({ rating, hideRating, signIn = DEFAULT_SIGN_IN, calcu
     </>
   );
 };
+
+export const OscrInfoTooltip = () => {
+  return (
+    <Tooltip
+      content={
+        <div className="grid gap-2">
+          <p>OSCR evaluates the engagement and impact of contributors across the entire open source ecosystem.</p>
+
+          <a
+            href="https://opensauced.pizza/docs/features/contributor-insights/#open-source-contributor-rating-oscr"
+            className="underline"
+          >
+            Learn more...
+            <span className="sr-only"> about OSCR rating</span>
+          </a>
+        </div>
+      }
+      className="w-fit max-w-xs !text-sm shadow-lg text-slate-100 !px-4 !py-3 !rounded-xl"
+    >
+      <HiOutlineInformationCircle className="text-slate-500" />
+    </Tooltip>
+  );
+};

components/Tables/ContributorsTable.tsx

@@ -22,7 +22,7 @@ import Avatar from "components/atoms/Avatar/avatar";
 import { getAvatarByUsername } from "lib/utils/github";
 import HoverCardWrapper from "components/molecules/HoverCardWrapper/hover-card-wrapper";
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "components/shared/Table";
-import { OscrPill } from "components/Contributors/Oscr";
+import { OscrInfoTooltip, OscrPill } from "components/Contributors/Oscr";
 import { useMediaQuery } from "lib/hooks/useMediaQuery";
 import { setQueryParams } from "lib/utils/query-params";
 import Pagination from "components/molecules/Pagination/pagination";
@@ -212,7 +212,7 @@ const mobileColumns = ({ isLoggedIn }: { isLoggedIn: boolean }) => [
         header: () => (
           <div className="flex gap-2 w-fit items-center">
             <p>OSCR</p>
-            <InfoTooltip information="OSCR evaluates the engagement and impact of contributors across the entire open source ecosystem." />
+            <OscrInfoTooltip />
           </div>
         ),
         enableSorting: true,

components/atoms/Tooltip/tooltip.tsx

@@ -4,7 +4,7 @@ import clsx from "clsx";
 
 interface TooltipProps {
   children: React.ReactNode;
-  content: string;
+  content: React.ReactNode;
   direction?: "top" | "right" | "left" | "bottom";
   delay?: number;
   className?: string;

components/molecules/NewsletterForm/newsletter-form.stories.tsx

@@ -1,12 +1,12 @@
 import { ComponentMeta, ComponentStory } from "@storybook/react";
-import NewsletterLink from "components/molecules/NewsletterForm/newsletter-form";
+import NewsletterForm from "components/molecules/NewsletterForm/newsletter-form";
 
 const storyConfig = {
   title: "Design System/Molecules/NewsletterForm",
-} as ComponentMeta<typeof NewsletterLink>;
+} as ComponentMeta<typeof NewsletterForm>;
 
 export default storyConfig;
 
-const NewsletterFormTemplate: ComponentStory<typeof NewsletterLink> = (args) => <NewsletterLink />;
+const NewsletterFormTemplate: ComponentStory<typeof NewsletterForm> = (args) => <NewsletterForm />;
 
 export const Default = NewsletterFormTemplate.bind({});

components/molecules/NewsletterForm/newsletter-form.tsx

@@ -38,7 +38,7 @@ const NewsletterForm = () => {
     setLoading(true);
 
     try {
-      const res = await fetch("/", {
+      const res = await fetch("/__newsletter.html", {
         method: "POST",
         headers: { "Content-Type": "application/x-www-form-urlencoded" },
         body: new URLSearchParams(formData).toString(),
@@ -87,14 +87,7 @@ const NewsletterForm = () => {
               Stay up to date with the latest OpenSauced news and trends!
             </p>
           </div>
-          <form
-            name="newsletter"
-            data-netlify="true"
-            method="post"
-            autoComplete="off"
-            className="w-full"
-            onSubmit={handleSubmit}
-          >
+          <form name="newsletter" method="post" autoComplete="off" className="w-full" onSubmit={handleSubmit}>
             <div hidden aria-hidden="true">
               <label>
                 Try your luck
@@ -137,30 +130,4 @@ const NewsletterForm = () => {
   );
 };
 
-const NewsletterLink = () => {
-  return (
-    <aside
-      aria-labelledby="subscribe-to-newsletter"
-      className="newsletter-wrap flex flex-col w-full gap-3 p-6 pt-5 border rounded-lg bg-light-slate-1"
-    >
-      <div className="w-64 space-y-1">
-        <h2 className="text-lg" id="subscribe-to-newsletter">
-          Subscribe to our newsletter
-        </h2>
-        <p className="text-sm font-normal text-light-slate-11">
-          Stay up to date with the latest OpenSauced news and trends!
-        </p>
-      </div>
-      <a
-        href="https://news.opensauced.pizza/#/portal/signup"
-        target="_blank"
-        className="flex flex-none justify-center py-1 border-light-orange-7 text-light-orange-10 px-2"
-        type="button"
-      >
-        Subscribe
-      </a>
-    </aside>
-  );
-};
-
-export default NewsletterLink;
+export default NewsletterForm;

components/organisms/ContributorProfileTab/contributor-profile-tab.tsx

@@ -37,8 +37,7 @@ import { DayRangePicker } from "components/shared/DayRangePicker";
 import IssueCommentsTable from "components/Profiles/IssueCommentsTable/issue-comments-table";
 import { contributionsOptions, useContributionsFilter } from "components/Profiles/contributors-sub-tab-list";
 import { SubTabsList } from "components/TabList/tab-list";
-import { OscrButton } from "components/Contributors/Oscr";
-import InfoTooltip from "components/shared/InfoTooltip";
+import { OscrButton, OscrInfoTooltip } from "components/Contributors/Oscr";
 import { INITIAL_DEV_STATS_TIMESTAMP } from "lib/utils/devStats";
 import UserRepositoryRecommendations from "../UserRepositoryRecommendations/user-repository-recommendations";
 
@@ -375,7 +374,7 @@ const ContributorProfileTab = ({
                 <span className="relative text-xs text-light-slate-11 flex gap-0.5 items-center">
                   <span>OSCR Rating</span>
                   <span className="text-sm grid place-content-center">
-                    <InfoTooltip information="OSCR evaluates the engagement and impact of contributors across the entire open source ecosystem." />
+                    <OscrInfoTooltip />
                   </span>
                 </span>
                 <div className="flex mt-1 text-lg md:text-xl lg:text-2xl !text-black leading-none">

package.json

@@ -2,7 +2,7 @@
   "name": "@open-sauced/app",
   "description": "🍕The dashboard for open source discovery.",
   "keywords": [],
-  "version": "2.54.0",
+  "version": "2.55.0-beta.2",
   "author": "Brian Douglas <[email protected]>",
   "private": true,
   "license": "Apache 2.0",

pages/feed/index.tsx

@@ -28,7 +28,7 @@ import Pagination from "components/molecules/Pagination/pagination";
 import PaginationResults from "components/molecules/PaginationResults/pagination-result";
 import FollowingHighlightWrapper from "components/organisms/FollowersHighlightWrapper/following-highlight-wrapper";
 import HomeHighlightsWrapper from "components/organisms/HomeHighlightsWrapper/home-highlights-wrapper";
-import NewsletterLink from "components/molecules/NewsletterForm/newsletter-form";
+import NewsletterForm from "components/molecules/NewsletterForm/newsletter-form";
 import UserCard, { MetaObj } from "components/atoms/UserCard/user-card";
 import FeaturedHighlightsPanel from "components/molecules/FeaturedHighlightsPanel/featured-highlights-panel";
 import AnnouncementCard from "components/molecules/AnnouncementCard/announcement-card";
@@ -165,7 +165,7 @@ export default function Feeds(props: HighlightSSRProps) {
           twitterCard="summary_large_image"
         />
         <div className="hidden">
-          <NewsletterLink />
+          <NewsletterForm />
         </div>
       </>
     );
@@ -361,7 +361,7 @@ export default function Feeds(props: HighlightSSRProps) {
             {featuredHighlights && featuredHighlights.length > 0 && (
               <FeaturedHighlightsPanel highlights={featuredHighlights} />
             )}
-            <NewsletterLink />
+            <NewsletterForm />
           </div>
         </div>
       </WorkspaceLayout>

pages/s/[org]/[repo]/index.tsx

@@ -4,7 +4,7 @@ import { HiOutlineExternalLink } from "react-icons/hi";
 import { FaBalanceScale } from "react-icons/fa";
 import { FaRegClock } from "react-icons/fa6";
 
-import { useEffect, useMemo, useState } from "react";
+import { useMemo, useState } from "react";
 import dynamic from "next/dynamic";
 import { useRouter } from "next/router";
 import { usePostHog } from "posthog-js/react";
@@ -43,6 +43,7 @@ import RossChart from "components/Repositories/RossChart";
 import YoloChart from "components/Repositories/YoloChart";
 import LanguagePill, { getLanguageTopic } from "components/shared/LanguagePill/LanguagePill";
 import OssfChart from "components/Repositories/OssfChart";
+import { setQueryParams } from "lib/utils/query-params";
 
 const AddToWorkspaceModal = dynamic(() => import("components/Repositories/AddToWorkspaceModal"), {
   ssr: false,
@@ -96,19 +97,17 @@ export default function RepoPage({ repoData, ogImageUrl }: RepoPageProps) {
   const isMobile = useMediaQuery("(max-width: 576px)");
   const avatarUrl = getAvatarByUsername(repoData.full_name.split("/")[0], 96);
   const [lotteryState, setLotteryState] = useState<"lottery" | "yolo">("lottery");
-  const [yoloHideBots, setYoloHideBots] = useState(
-    router.query.hideBots ? (router.query.hideBots === "true" ? true : false) : false
-  );
+  const yoloHideBots = router.query.hideBots === "true";
   const [isAddToWorkspaceModalOpen, setIsAddToWorkspaceModalOpen] = useState(false);
   const range = (router.query.range ? Number(router.query.range) : 30) as Range;
   const tabList = [
     { name: "Overview", path: "" },
     { name: "Contributors", path: "contributors" },
   ];
 
-  useEffect(() => {
-    router.push({ query: { ...router.query, hideBots: yoloHideBots } });
-  }, [yoloHideBots]);
+  function setYoloHideBots(value: boolean) {
+    setQueryParams({ hideBots: `${value}` });
+  }
 
   const {
     data: starsData,

public/__newsletter.html

@@ -0,0 +1,9 @@
+<html>
+  <head></head>
+  <body>
+    <form name="newsletter" data-netlify="true" hidden>
+      <input type="hidden" name="form-name" value="newsletter" />
+      <input name="email" type="text" />
+    </form>
+  </body>
+</html>