Merge pull request #1048 from open-sauced/beta

v1.37.0-beta.7 -> production

CHANGELOG.md

@@ -5,6 +5,114 @@
 
 > All notable changes to this project will be documented in this file
 
+## [1.37.0-beta.7](https://github.com/open-sauced/insights/compare/v1.37.0-beta.6...v1.37.0-beta.7) (2023-03-23)
+
+
+### 🐛 Bug Fixes
+
+* make insights hub layout inconsistent on larger screens ([#1046](https://github.com/open-sauced/insights/issues/1046)) ([daaf6d1](https://github.com/open-sauced/insights/commit/daaf6d12d042af52ab0f1c405eb85caf207e80b5))
+* remove dialog layout overlap on single highlight view ([#1047](https://github.com/open-sauced/insights/issues/1047)) ([ea836e8](https://github.com/open-sauced/insights/commit/ea836e8090f41ece5a8fae9ff4aa5835166c51fd))
+
+## [1.37.0-beta.6](https://github.com/open-sauced/insights/compare/v1.37.0-beta.5...v1.37.0-beta.6) (2023-03-23)
+
+
+### 🍕 Features
+
+* replace react toast to radix ([#933](https://github.com/open-sauced/insights/issues/933)) ([3e000be](https://github.com/open-sauced/insights/commit/3e000be0e85b29cfdf16d58d1a74256ebcf85f8b))
+
+## [1.37.0-beta.5](https://github.com/open-sauced/insights/compare/v1.37.0-beta.4...v1.37.0-beta.5) (2023-03-23)
+
+
+### 🍕 Features
+
+* create collaboration Ui components ([#1006](https://github.com/open-sauced/insights/issues/1006)) ([19ff5a7](https://github.com/open-sauced/insights/commit/19ff5a73d1ae669722c307bbf9f16e1dd5be3fb4))
+
+## [1.37.0-beta.4](https://github.com/open-sauced/insights/compare/v1.37.0-beta.3...v1.37.0-beta.4) (2023-03-22)
+
+
+### 🐛 Bug Fixes
+
+*  updated footer file to update the year dynamically ([#1040](https://github.com/open-sauced/insights/issues/1040)) ([c766d95](https://github.com/open-sauced/insights/commit/c766d9521faf9d6198a9049772a285b9b2d32d00))
+
+## [1.37.0-beta.3](https://github.com/open-sauced/insights/compare/v1.37.0-beta.2...v1.37.0-beta.3) (2023-03-22)
+
+
+### 🐛 Bug Fixes
+
+* close highlight dialog when clicking outside its container ([#999](https://github.com/open-sauced/insights/issues/999)) ([1bc90bb](https://github.com/open-sauced/insights/commit/1bc90bb5c61b353aeb847fef98d738998fb9c142))
+
+## [1.37.0-beta.2](https://github.com/open-sauced/insights/compare/v1.37.0-beta.1...v1.37.0-beta.2) (2023-03-22)
+
+
+### 🐛 Bug Fixes
+
+* update avatar style to remain aligned with the input field ([#1037](https://github.com/open-sauced/insights/issues/1037)) ([2374f20](https://github.com/open-sauced/insights/commit/2374f204d75292ad2b947583e10ed485c1a2d4f0))
+
+## [1.37.0-beta.1](https://github.com/open-sauced/insights/compare/v1.36.0...v1.37.0-beta.1) (2023-03-22)
+
+
+### 🧑‍💻 Code Refactoring
+
+* Deleted unused hooks, removed unused exports and imports ([#1028](https://github.com/open-sauced/insights/issues/1028)) ([7b2bda2](https://github.com/open-sauced/insights/commit/7b2bda22957e389dde711832dad2e19a5b502ea1))
+
+
+### 🍕 Features
+
+* add teams UI for the design system ([#994](https://github.com/open-sauced/insights/issues/994)) ([499d08e](https://github.com/open-sauced/insights/commit/499d08e81aa890ac7a2cca0761fc7d670538c363))
+* added active styles to navbar links ([#1016](https://github.com/open-sauced/insights/issues/1016)) ([c25c0a3](https://github.com/open-sauced/insights/commit/c25c0a33230bca37aca12a98b243eaa00cd0731c)), closes [#697](https://github.com/open-sauced/insights/issues/697)
+* update top nav menu to be more responsive on mobile ([#1029](https://github.com/open-sauced/insights/issues/1029)) ([90c1e4a](https://github.com/open-sauced/insights/commit/90c1e4a9f5ffeaa9839d0afae503ba42859170da)), closes [#866](https://github.com/open-sauced/insights/issues/866)
+
+
+### 🐛 Bug Fixes
+
+* add a check for proper URL in avatarURL prop ([#1009](https://github.com/open-sauced/insights/issues/1009)) ([a425279](https://github.com/open-sauced/insights/commit/a4252797fa8093c8d3d472c26422e20a9ec44160))
+* center text inside upgrade access button ([#1027](https://github.com/open-sauced/insights/issues/1027)) ([cf3f6cb](https://github.com/open-sauced/insights/commit/cf3f6cbd7c5a7bf4db76733c9b90255a5bc09d39)), closes [#1024](https://github.com/open-sauced/insights/issues/1024)
+* make delete standout ([#1026](https://github.com/open-sauced/insights/issues/1026)) ([9c68287](https://github.com/open-sauced/insights/commit/9c68287eabbe9b826efd27f0a70c3e0d48ba120e))
+* refresh highlights list on update and delete ([#1034](https://github.com/open-sauced/insights/issues/1034)) ([bf2d951](https://github.com/open-sauced/insights/commit/bf2d9518bdf7b38e8dbdc147e8f01284041b511e))
+
+## [1.36.0-beta.9](https://github.com/open-sauced/insights/compare/v1.36.0-beta.8...v1.36.0-beta.9) (2023-03-21)
+
+
+### 🐛 Bug Fixes
+
+* add a check for proper URL in avatarURL prop ([#1009](https://github.com/open-sauced/insights/issues/1009)) ([a425279](https://github.com/open-sauced/insights/commit/a4252797fa8093c8d3d472c26422e20a9ec44160))
+
+
+### 🍕 Features
+
+* update top nav menu to be more responsive on mobile ([#1029](https://github.com/open-sauced/insights/issues/1029)) ([90c1e4a](https://github.com/open-sauced/insights/commit/90c1e4a9f5ffeaa9839d0afae503ba42859170da)), closes [#866](https://github.com/open-sauced/insights/issues/866)
+
+## [1.36.0-beta.8](https://github.com/open-sauced/insights/compare/v1.36.0-beta.7...v1.36.0-beta.8) (2023-03-20)
+
+
+### 🐛 Bug Fixes
+
+* make delete standout ([#1026](https://github.com/open-sauced/insights/issues/1026)) ([9c68287](https://github.com/open-sauced/insights/commit/9c68287eabbe9b826efd27f0a70c3e0d48ba120e))
+
+## [1.36.0-beta.7](https://github.com/open-sauced/insights/compare/v1.36.0-beta.6...v1.36.0-beta.7) (2023-03-20)
+
+
+### 🧑‍💻 Code Refactoring
+
+* Deleted unused hooks, removed unused exports and imports ([#1028](https://github.com/open-sauced/insights/issues/1028)) ([7b2bda2](https://github.com/open-sauced/insights/commit/7b2bda22957e389dde711832dad2e19a5b502ea1))
+
+
+### 🍕 Features
+
+* added active styles to navbar links ([#1016](https://github.com/open-sauced/insights/issues/1016)) ([c25c0a3](https://github.com/open-sauced/insights/commit/c25c0a33230bca37aca12a98b243eaa00cd0731c)), closes [#697](https://github.com/open-sauced/insights/issues/697)
+
+
+### 🐛 Bug Fixes
+
+* center text inside upgrade access button ([#1027](https://github.com/open-sauced/insights/issues/1027)) ([cf3f6cb](https://github.com/open-sauced/insights/commit/cf3f6cbd7c5a7bf4db76733c9b90255a5bc09d39)), closes [#1024](https://github.com/open-sauced/insights/issues/1024)
+
+## [1.36.0-beta.6](https://github.com/open-sauced/insights/compare/v1.36.0-beta.5...v1.36.0-beta.6) (2023-03-17)
+
+
+### 🍕 Features
+
+* add teams UI for the design system ([#994](https://github.com/open-sauced/insights/issues/994)) ([499d08e](https://github.com/open-sauced/insights/commit/499d08e81aa890ac7a2cca0761fc7d670538c363))
+
 ## [1.36.0](https://github.com/open-sauced/insights/compare/v1.35.0...v1.36.0) (2023-03-16)
 
 

components/atoms/Avatar/avatar-hover-card.tsx

@@ -7,7 +7,7 @@ import HoverCardWrapper from "components/molecules/HoverCardWrapper/hover-card-w
 import { getAvatarByUsername } from "lib/utils/github";
 import roundedImage from "lib/utils/roundedImages";
 
-export declare interface AvatarProps {
+declare interface AvatarProps {
   contributor: string;
   repositories: number[];
 }

components/atoms/Avatar/avatar.tsx

@@ -1,4 +1,3 @@
-import React from "react";
 import Image, { StaticImageData } from "next/image";
 import AvatarImage from "../../../img/hacktoberfest-icon.png";
 import cachedImage from "lib/utils/cachedImages";
@@ -8,7 +7,7 @@ interface AvatarProps {
   avatarURL?: string | StaticImageData;
   initials?: string;
   alt?: string;
-  size?: "sm" | "base" | "lg" | number;
+  size: "sm" | "base" | "lg" | number;
   hasBorder?: boolean;
   isCircle?: boolean;
   isCached?: boolean;
@@ -20,19 +19,24 @@ const avatarLoader = () => {
 };
 
 const Avatar = (props: AvatarProps): JSX.Element => {
-  const imageSource =
-    props.avatarURL && props.isCached
+  let imageSource: string | StaticImageData | undefined = undefined;
+
+  try {
+    // Checks if the avatarURL is a proper URL. If not, it will throw an error.
+    if(typeof props.avatarURL === "string") new URL(props.avatarURL);
+
+    imageSource = props.avatarURL && props.isCached
       ? cachedImage(props.avatarURL as string, process.env.NEXT_PUBLIC_CLOUD_NAME)
       : props.avatarURL;
+  } catch (error) {
+    console.error(error);
+  }
 
   switch (typeof props.size) {
   case "string":
     return <DefaultAvatar {...props} avatarURL={imageSource} />;
   case "number":
     return <CustomAvatar {...props} avatarURL={imageSource} />;
-
-  default:
-    return <span>invalid avatar size props!!!</span>;
   }
 };
 
@@ -53,9 +57,10 @@ const CustomAvatar = ({
       className={`inline-flex ${
         avatarURL ? "" : "bg-orange-500"
       } justify-center relative items-center w-max h-max overflow-hidden
-        ${className ?? " "}
+
         ${isCircle ? "rounded-full " : "rounded-lg "}
         ${hasBorder ? "ring-2 ring-slate-200 " : ""}
+        ${className ?? " "}
       `}
     >
       {avatarURL ? (
@@ -64,7 +69,7 @@ const CustomAvatar = ({
           alt={alt ? alt : "Avatar"}
           width={size as number}
           height={size as number}
-          src={avatarURL ? avatarURL : AvatarImage}
+          src={avatarURL}
         />
       ) : (
         <div
@@ -93,14 +98,15 @@ const DefaultAvatar = ({
         ${isCircle ? "rounded-full " : "rounded-lg "}
         ${hasBorder ? "ring-2 ring-slate-200 " : ""}
         ${size === "sm" ? "w-6 h-6 " : size === "base" ? "w-8 h-8 " : size === "lg" ? "w-12 h-12 " : "w-8 h-8 "}
+        ${className ?? " "}
       `}
     >
       {avatarURL ? (
         <Image
           className={`${className ? className : ""} object-cover`}
           alt={alt ? alt : "Avatar"}
           fill={true}
-          src={avatarURL ? avatarURL : AvatarImage}
+          src={avatarURL}
         />
       ) : (
         <div

components/atoms/Checkbox/checkbox.tsx

@@ -1,4 +1,4 @@
-import React, { HTMLAttributes } from "react";
+import React from "react";
 import { Checkbox as SupbaseCheckboxComponent } from "@supabase/ui";
 
 interface CheckboxProps extends React.ComponentProps<typeof SupbaseCheckboxComponent> {

components/atoms/Dropdown/dropdown.tsx

@@ -42,4 +42,4 @@ const DropdownMenuItem = React.forwardRef<
 ));
 DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
 
-export { DropdownMenu, DropdownMenuItem, DropdownMenuContent, DropdownMenuTrigger, DropdownMenuPortal };
+export { DropdownMenu, DropdownMenuItem, DropdownMenuContent, DropdownMenuTrigger};

components/atoms/FavoriteSelector/favorite-selector.tsx

@@ -1,4 +1,3 @@
-import React from "react";
 import { AiFillStar } from "react-icons/ai";
 import { AiOutlineStar } from "react-icons/ai";
 

components/atoms/LanguagePill/LanguagePill.tsx

@@ -1,4 +1,3 @@
-import React from "react";
 import Image, { StaticImageData } from "next/image";
 
 

components/atoms/Radio/radio.tsx

@@ -3,24 +3,24 @@ import { BsFillCheckCircleFill } from "react-icons/bs";
 import { MdOutlineRadioButtonUnchecked } from "react-icons/md";
 
 interface RadioProps {
-  id?: string | undefined;
-  children?: any;
+  id?: string;
+  children: React.ReactNode;
   checked?: boolean;
   onClick?: () => void;
   value?: string;
   withLabel?: string;
-  css?: string;
+  className?: string;
 }
 
-const Radio = ({ css, withLabel, id, children, value, checked = false, onClick }: RadioProps): JSX.Element => {
+const Radio = ({ className, withLabel, id, children, value, checked = false, onClick }: RadioProps): JSX.Element => {
   return (
     <div
       onClick={onClick}
       className={
         `${
           checked && "!bg-light-orange-3"
         }  px-2 py-1.5 text-sm text-slate-600   group  rounded-md  hover:bg-light-orange-3 hover:text-slate-800 focus:outline-none focus-visible:border-orange-500 focus-visible:ring focus-visible:ring-orange-200 transition` +
-        `${css}`
+        `${className}`
       }
     >
       <input

components/atoms/RadioCheck/radio-check.tsx

@@ -0,0 +1,43 @@
+import React from "react";
+import { BsCheck2 } from "react-icons/bs";
+
+interface RadioCheckProps {
+  id?: string;
+  children: React.ReactNode;
+  checked?: boolean;
+  onClick?: () => void;
+  value?: string;
+  className?: string;
+}
+
+const RadioCheck = ({ className, id, children, value, checked = false, onClick }: RadioCheckProps): JSX.Element => {
+  return (
+    <div
+      onClick={onClick}
+      className={
+        "px-2 py-1.5 text-sm text-black group  rounded-md  hover:bg-light-orange-3 hover:text-light-orange-9 hover:text-slate-800 focus:outline-none focus-visible:border-orange-500 focus-visible:ring focus-visible:ring-orange-200 transition" +
+        `${className}`
+      }
+    >
+      <input
+        type="radio"
+        className="opacity-0"
+        value={value}
+        name="radio"
+        checked={checked}
+        onChange={onClick}
+        id={id}
+      />
+      <label className="flex -mt-5 cursor-pointer item-center" htmlFor={id}>
+        {checked ? (
+          <BsCheck2 className="text-xl bold text-black" />
+        ) : (
+          <BsCheck2 className="text-xl group-hover:text-orange-300 invisible" />
+        )}
+        <span className="ml-3 leading-none my-auto">{children}</span>
+      </label>
+    </div>
+  );
+};
+
+export default RadioCheck;

components/atoms/Select/custom-select.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import { useState } from "react";
 import * as Select from "@radix-ui/react-select";
 import clsx from "clsx";
 

components/atoms/Selector/selector.tsx

@@ -1,34 +1,49 @@
 import Radio from "components/atoms/Radio/radio";
-import humanizeNumber from "lib/utils/humanizeNumber";
+import RadioCheck from "../RadioCheck/radio-check";
 
 interface SelectorProps {
   filterOptions: string[];
   handleFilterClick: (filter: string) => void;
   selected?: string;
+  variation?: "circle" | "check"
 }
 
 const Selector = ({
   filterOptions,
   handleFilterClick,
-  selected
+  selected,
+  variation = "circle"
 }: SelectorProps) => {
   return (
     <div className="mt-2 absolute transform md:translate-x-0 space-y-1 mt-1 shadow-superlative z-10 w-72 bg-white rounded-lg px-1.5 py-2">
       {filterOptions.length > 0 &&
-            filterOptions.map((option, index) => {
-              return (
-                <Radio
-                  key={index}
-                  onClick={() => {
-                    handleFilterClick(option);
-                  }}
-                  css="!w-full"
-                  checked={selected === option ? true : false}
-                >
-                  {option}
-                </Radio>
-              );
-            })}
+        filterOptions.map((option, index) => {
+          return (
+            variation === "circle" ? (
+              <Radio
+                key={index}
+                onClick={() => {
+                  handleFilterClick(option);
+                }}
+                className="!w-full"
+                checked={selected === option ? true : false}
+              >
+                {option}
+              </Radio>
+            ) : (
+              <RadioCheck
+                key={index}
+                onClick={() => {
+                  handleFilterClick(option);
+                }}
+                className="!w-full"
+                checked={selected === option ? true : false}
+              >
+                {option}
+              </RadioCheck>
+            )
+          );
+        })}
     </div>
   );
 };

components/atoms/Textarea/text-area.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import clsx from "clsx";
 
-export interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
+interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
 
 const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(({ className, ...props }, ref) => {
   return (