chore: release 2.60.0 (#4015)

open-sauced · Aug 22, 2024 · ba38283 · ba38283
2 parents bf4f615 + 885a539
commit ba38283
Show file tree

Hide file tree

Showing 8 changed files with 176 additions and 67 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -5,6 +5,39 @@
 
 > All notable changes to this project will be documented in this file
 
+## [2.60.0-beta.4](https://github.com/open-sauced/app/compare/v2.60.0-beta.3...v2.60.0-beta.4) (2024-08-22)
+
+
+### 🍕 Features
+
+* copy repo page YOLO Chart as image ([#4014](https://github.com/open-sauced/app/issues/4014)) ([376dbe2](https://github.com/open-sauced/app/commit/376dbe28a31f281fc90759c5c4eabd6960027844))
+
+## [2.60.0-beta.3](https://github.com/open-sauced/app/compare/v2.60.0-beta.2...v2.60.0-beta.3) (2024-08-22)
+
+
+### 🍕 Features
+
+* now you can copy the contributor confidence chart as an image ([#3966](https://github.com/open-sauced/app/issues/3966)) ([3291c6d](https://github.com/open-sauced/app/commit/3291c6d1f878f2693ccabb979a33011f6de7d77b))
+
+
+### 🐛 Bug Fixes
+
+* resolve incorrect redirect to 404 page on search fields ([#3959](https://github.com/open-sauced/app/issues/3959)) ([298161d](https://github.com/open-sauced/app/commit/298161dc7dd9973e1db05b80508c5b9bdcac7624))
+
+## [2.60.0-beta.2](https://github.com/open-sauced/app/compare/v2.60.0-beta.1...v2.60.0-beta.2) (2024-08-22)
+
+
+### 🐛 Bug Fixes
+
+* always show Add to Workspace button on repositories table ([#4003](https://github.com/open-sauced/app/issues/4003)) ([5954f32](https://github.com/open-sauced/app/commit/5954f321b1d1051b9ea022d7c9e762896609370b))
+
+## [2.60.0-beta.1](https://github.com/open-sauced/app/compare/v2.59.0...v2.60.0-beta.1) (2024-08-21)
+
+
+### 🍕 Features
+
+* copy OSSF Scorecard as image ([#4000](https://github.com/open-sauced/app/issues/4000)) ([690fb38](https://github.com/open-sauced/app/commit/690fb38381275b95b39efe266cad2e1bdcff44b9))
+
 ## [2.59.0](https://github.com/open-sauced/app/compare/v2.58.0...v2.59.0) (2024-08-21)
 
 

diff --git a/components/Repositories/ContributorConfidenceChart.tsx b/components/Repositories/ContributorConfidenceChart.tsx
@@ -52,16 +52,17 @@ export default function ContributorConfidenceChart({
   };
 
   return (
-    <Card className={`${className ?? ""} flex flex-col gap-4 w-full h-fit items-center py-8`}>
+    <Card className={`${className ?? ""} flex flex-col gap-4 w-full h-fit items-center py-8 graph-to-image`}>
       <header className="flex items-center justify-between w-full px-4">
         <div className="flex items-center gap-2">
-          <FaUserPlus className="text-xl" />
+          <FaUserPlus className="text-xl contributor-confidence-logo" />
           <h3 className="text-sm font-semibold xl:text-lg text-slate-800">Contributor Confidence</h3>
         </div>
         <a
           href="https://opensauced.pizza/docs/features/repo-pages/#insights-into-contributor-confidence"
           onClick={onLearnMoreClick}
           className="text-xs font-semibold text-sauced-orange xl:text-sm hover:underline"
+          data-html2canvas-ignore
         >
           Learn More
         </a>

diff --git a/components/Repositories/OssfChart.tsx b/components/Repositories/OssfChart.tsx
@@ -110,6 +110,7 @@ export default function OssfChart({
             href="https://opensauced.pizza/docs/features/repo-pages/#insights-into-the-ossf-scorecard"
             onClick={onLearnMoreClick}
             className="text-xs font-semibold text-sauced-orange xl:text-sm hover:underline"
+            data-html2canvas-ignore
           >
             Learn More
           </a>
@@ -151,7 +152,7 @@ export default function OssfChart({
               <p className="text-xs text-slate-600">
                 {projectDescription}
                 {!isError && (
-                  <span>
+                  <span data-html2canvas-ignore>
                     You can run the full test{" "}
                     <a
                       href="https://github.com/ossf/scorecard?tab=readme-ov-file#view-a-projects-score"

diff --git a/components/organisms/Repositories/repositories.tsx b/components/organisms/Repositories/repositories.tsx
@@ -1,7 +1,8 @@
-import { ComponentProps, useEffect, useState } from "react";
-import { useRouter } from "next/router";
 import clsx from "clsx";
+import { useRouter } from "next/router";
+import { ComponentProps, useEffect, useState } from "react";
 
+import { usePostHog } from "posthog-js/react";
 import TableTitle from "components/atoms/TableTitle/table-title";
 import Pagination from "components/molecules/Pagination/pagination";
 import PaginationResults from "components/molecules/PaginationResults/pagination-result";
@@ -12,8 +13,8 @@ import useSupabaseAuth from "lib/hooks/useSupabaseAuth";
 import { setQueryParams } from "lib/utils/query-params";
 
 import Checkbox from "components/atoms/Checkbox/checkbox";
-import Button from "components/shared/Button/button";
 import LimitSelect from "components/atoms/Select/limit-select";
+import Button from "components/shared/Button/button";
 import { useMediaQuery } from "lib/hooks/useMediaQuery";
 import RepositoriesTable, { classNames, RepositoriesRows } from "../RepositoriesTable/repositories-table";
 import RepoNotIndexed from "./repository-not-indexed";
@@ -27,6 +28,7 @@ interface RepositoriesProps {
 export default function Repositories({ repositories, showSearch = true, personalWorkspaceId }: RepositoriesProps) {
   const { user, signIn } = useSupabaseAuth();
   const router = useRouter();
+  const posthog = usePostHog();
   const workspaceId = router.query.workspaceId as string;
   const { pageId, toolName, selectedFilter, userOrg, range = 30, limit = 10 } = router.query;
   const username = userOrg ? user?.user_metadata.user_name : undefined;
@@ -53,6 +55,11 @@ export default function Repositories({ repositories, showSearch = true, personal
   };
 
   const handleOnAddtoInsights = () => {
+    posthog.capture(`Explore Page: added repos to ${!workspaceId ? "a new" : "existing"} workspace`, {
+      workspaceId,
+      repos: selectedRepos.map((repo) => repo.full_name),
+    });
+
     if (!workspaceId) {
       router.push({
         pathname: `/workspaces/new`,
@@ -88,10 +95,10 @@ export default function Repositories({ repositories, showSearch = true, personal
 
   const handleOnSearch = (search?: string) => {
     if (selectedFilter && !search) {
-      return router.push(`/${topic}/${toolName}`);
+       return router.push(`/explore/topic/${topic}/${toolName}`);
     }
     if (search && /^[a-zA-Z0-9\-\.]+\/[a-zA-Z0-9\-\.]+$/.test(search)) {
-      return router.push(`/${topic}/${toolName}/filter/${search}`);
+      return router.push(`/explore/topic/${topic}/${toolName}/filter/${search}`);
     }
   };
 
@@ -146,20 +153,12 @@ export default function Repositories({ repositories, showSearch = true, personal
             </div>
           </div>
 
-          {selectedRepos.length > 0 && (
-            <div
-              aria-hidden={selectedRepos.length === 0}
-              className={clsx(
-                selectedRepos.length > 0 ? "flex" : "hidden",
-                `justify-between p-3 px-6 items-center border-b-2 text-light-slate-11`
-              )}
-            >
-              <div>{selectedRepos.length} Repositories selected</div>
-              <Button onClick={handleOnAddtoInsights} variant="primary">
-                {workspaceId ? "Add to Insight Page" : "Add to Workspace"}
-              </Button>
-            </div>
-          )}
+          <div className={clsx(`flex justify-between p-3 px-6 items-center border-b-2 text-light-slate-11`)}>
+            {selectedRepos.length > 0 ? <div>{selectedRepos.length} Repositories selected</div> : <div></div>}
+            <Button disabled={selectedRepos.length === 0} onClick={handleOnAddtoInsights} variant="primary">
+              {workspaceId ? "Add to Insight Page" : "Add to Workspace"}
+            </Button>
+          </div>
 
           <RepositoriesTable
             topic={topic}

diff --git a/components/shared/CopyContainer.tsx b/components/shared/CopyContainer.tsx
@@ -9,13 +9,15 @@ interface CopyContainerProps {
   copySuccessMessage?: string;
   copyErrorMessage?: string;
   options?: Partial<Options>;
+  onCopyClick?: () => void;
   children: React.ReactNode;
 }
 
 export const CopyContainer = ({
   copySuccessMessage = "Copied image to clipboard",
   copyErrorMessage = "Error copying image",
   options,
+  onCopyClick,
   children,
 }: CopyContainerProps) => {
   const { toast } = useToast();
@@ -27,6 +29,7 @@ export const CopyContainer = ({
       <button
         className="absolute top-2 right-2 p-2 bg-white rounded-md shadow-md opacity-0 group-hover:opacity-100 focus-within:opacity-100 scale-95 group-hover:scale-100 transition-all duration-200 ease-in-out transform"
         onClick={async () => {
+          onCopyClick?.();
           const node = copyRef.current;
 
           try {

diff --git a/npm-shrinkwrap.json b/npm-shrinkwrap.json
diff --git a/package.json b/package.json
@@ -2,7 +2,7 @@
   "name": "@open-sauced/app",
   "description": "🍕The dashboard for open source discovery.",
   "keywords": [],
-  "version": "2.59.0",
+  "version": "2.60.0-beta.4",
   "author": "Brian Douglas <[email protected]>",
   "private": true,
   "license": "Apache 2.0",

diff --git a/pages/s/[org]/[repo]/index.tsx b/pages/s/[org]/[repo]/index.tsx
@@ -360,25 +360,74 @@ export default function RepoPage({ repoData, ogImageUrl }: RepoPageProps) {
               <section className="flex flex-col gap-4 lg:grid lg:grid-cols-12 lg:max-h-[50rem]">
                 <div className="lg:col-span-8 flex flex-col gap-4">
                   <div className="flex gap-4 h-full flex-col lg:flex-row">
-                    <ContributorConfidenceChart
-                      contributorConfidence={repoStats?.contributor_confidence}
-                      isError={isError}
-                      isLoading={isLoading}
-                      onLearnMoreClick={() =>
-                        posthog.capture("Repo Pages: clicked Contributor Confidence docs", {
+                    <CopyContainer
+                      onCopyClick={() => {
+                        posthog.capture("Repo Pages: copied Contributor Confidence chart", {
                           repository: repoData.full_name,
-                        })
-                      }
-                    />
-                    <OssfChart
-                      repository={repoData.full_name}
-                      totalScore={repoData.ossf_scorecard_total_score}
-                      dependencyUpdateScore={repoData.ossf_scorecard_dependency_update_score}
-                      maintainedScore={repoData.ossf_scorecard_maintained_score}
-                      fuzzingScore={repoData.ossf_scorecard_fuzzing_score}
-                      isLoading={false}
-                      isError={!repoData.ossf_scorecard_total_score}
-                    />
+                        });
+                      }}
+                      options={{
+                        windowWidth: 1700,
+                        allowTaint: true,
+                        onclone(document, element) {
+                          element.querySelectorAll("[data-copy-image-branding]").forEach((el) => {
+                            el.classList.remove("hidden");
+                          });
+                          element.querySelector("ContributorConfidenceChart")?.classList.add("z-20");
+                        },
+                      }}
+                    >
+                      <CopyImageBranding repository={repoData.full_name} />
+                      <ContributorConfidenceChart
+                        contributorConfidence={repoStats?.contributor_confidence}
+                        isError={isError}
+                        isLoading={isLoading}
+                        onLearnMoreClick={() =>
+                          posthog.capture("Repo Pages: clicked Contributor Confidence docs", {
+                            repository: repoData.full_name,
+                          })
+                        }
+                      />
+                    </CopyContainer>
+                    {!repoData.ossf_scorecard_total_score ? (
+                      <OssfChart
+                        repository={repoData.full_name}
+                        totalScore={repoData.ossf_scorecard_total_score}
+                        dependencyUpdateScore={repoData.ossf_scorecard_dependency_update_score}
+                        maintainedScore={repoData.ossf_scorecard_maintained_score}
+                        fuzzingScore={repoData.ossf_scorecard_fuzzing_score}
+                        isLoading={false}
+                        isError={!repoData.ossf_scorecard_total_score}
+                      />
+                    ) : (
+                      <CopyContainer
+                        onCopyClick={() => {
+                          posthog.capture("Repo Pages: copied OSSF Scorecard", {
+                            repository: repoData.full_name,
+                          });
+                        }}
+                        options={{
+                          windowWidth: 1700,
+                          allowTaint: true,
+                          onclone: (document, element) => {
+                            element.querySelectorAll("[data-copy-image-branding]").forEach((el) => {
+                              el.classList.remove("hidden");
+                            });
+                          },
+                        }}
+                      >
+                        <CopyImageBranding repository={repoData.full_name} />
+                        <OssfChart
+                          repository={repoData.full_name}
+                          totalScore={repoData.ossf_scorecard_total_score}
+                          dependencyUpdateScore={repoData.ossf_scorecard_dependency_update_score}
+                          maintainedScore={repoData.ossf_scorecard_maintained_score}
+                          fuzzingScore={repoData.ossf_scorecard_fuzzing_score}
+                          isLoading={false}
+                          isError={!repoData.ossf_scorecard_total_score}
+                        />
+                      </CopyContainer>
+                    )}
                   </div>
 
                   <RossChart
@@ -400,6 +449,11 @@ export default function RepoPage({ repoData, ogImageUrl }: RepoPageProps) {
                 <div className="lg:col-span-4 flex flex-col gap-4">
                   {lotteryState === "lottery" && (
                     <CopyContainer
+                      onCopyClick={() => {
+                        posthog.capture("Repo Pages: copied Lottery Factor chart", {
+                          repository: repoData.full_name,
+                        });
+                      }}
                       options={{
                         windowWidth: 1700,
                         allowTaint: true,
@@ -440,31 +494,49 @@ export default function RepoPage({ repoData, ogImageUrl }: RepoPageProps) {
                     </CopyContainer>
                   )}
                   {lotteryState === "yolo" && (
-                    <YoloChart
-                      yoloStats={yoloStats}
-                      uniqueYoloCoders={uniqueYoloCoders}
-                      yoloHideBots={yoloHideBots}
-                      setYoloHideBots={setYoloHideBots}
-                      repository={repoData.full_name}
-                      isLoading={isYoloStatsLoading}
-                      range={range}
-                      backButtonOnClick={() => setLotteryState("lottery")}
-                      onShaClick={() =>
-                        posthog.capture("Repo Pages: clicked SHA link", { repository: repoData.full_name })
-                      }
-                      onProfileClick={() =>
-                        posthog.capture("Repo Pages: clicked YOLO coder (YOLO Chart)", {
-                          repository: repoData.full_name,
-                        })
-                      }
-                      onHideBotsToggle={(checked) =>
-                        posthog.capture("Repo Pages: toggled YOLO hide bots", {
+                    <CopyContainer
+                      onCopyClick={() => {
+                        posthog.capture("Repo Pages: copied Lottery Factor chart", {
                           repository: repoData.full_name,
-                          checked,
-                        })
-                      }
-                      showHoverCards
-                    />
+                        });
+                      }}
+                      options={{
+                        windowWidth: 1700,
+                        allowTaint: true,
+                        onclone: (document, element) => {
+                          element.querySelectorAll("[data-copy-image-branding]").forEach((el) => {
+                            el.classList.remove("hidden");
+                          });
+                        },
+                      }}
+                    >
+                      <CopyImageBranding repository={repoData.full_name} />
+                      <YoloChart
+                        yoloStats={yoloStats}
+                        uniqueYoloCoders={uniqueYoloCoders}
+                        yoloHideBots={yoloHideBots}
+                        setYoloHideBots={setYoloHideBots}
+                        repository={repoData.full_name}
+                        isLoading={isYoloStatsLoading}
+                        range={range}
+                        backButtonOnClick={() => setLotteryState("lottery")}
+                        onShaClick={() =>
+                          posthog.capture("Repo Pages: clicked SHA link", { repository: repoData.full_name })
+                        }
+                        onProfileClick={() =>
+                          posthog.capture("Repo Pages: clicked YOLO coder (YOLO Chart)", {
+                            repository: repoData.full_name,
+                          })
+                        }
+                        onHideBotsToggle={(checked) =>
+                          posthog.capture("Repo Pages: toggled YOLO hide bots", {
+                            repository: repoData.full_name,
+                            checked,
+                          })
+                        }
+                        showHoverCards
+                      />
+                    </CopyContainer>
                   )}
                 </div>
               </section>