Merge branch 'beta' into nickytonline/decrease-tooltip-dealy

CHANGELOG.md

@@ -5,6 +5,42 @@
 
 > All notable changes to this project will be documented in this file
 
+## [1.71.0-beta.14](https://github.com/open-sauced/insights/compare/v1.71.0-beta.13...v1.71.0-beta.14) (2023-10-17)
+
+
+### 🐛 Bug Fixes
+
+* can't update user profile bio passed 256 chars ([00a77be](https://github.com/open-sauced/insights/commit/00a77bebd5121a45cdcb4d890e0a57c4f727d7ba))
+* can't update user profile bio passed 256 chars ([#1898](https://github.com/open-sauced/insights/issues/1898)) ([42c99c7](https://github.com/open-sauced/insights/commit/42c99c7fd63a8399846e8f8820a9e738d31ac693))
+
+## [1.71.0-beta.13](https://github.com/open-sauced/insights/compare/v1.71.0-beta.12...v1.71.0-beta.13) (2023-10-17)
+
+
+### 🐛 Bug Fixes
+
+* refactored parameters for captureAnalytics to an object ([a2af672](https://github.com/open-sauced/insights/commit/a2af672008ec43bc0ba58e7e90ce2dda91ae7913))
+
+
+### 🍕 Features
+
+* add identifier to analytics ([#1887](https://github.com/open-sauced/insights/issues/1887)) ([8169213](https://github.com/open-sauced/insights/commit/81692132ce0f906c914f95454e7281bd3c367a26))
+* implemented usage of posthog.identify(identifier) ([30a4bc0](https://github.com/open-sauced/insights/commit/30a4bc0f42b3c5a902be7f0e8f86e1944c77660f))
+
+## [1.71.0-beta.12](https://github.com/open-sauced/insights/compare/v1.71.0-beta.11...v1.71.0-beta.12) (2023-10-17)
+
+
+### 🐛 Bug Fixes
+
+* hide secondary header in create insights page ([#1925](https://github.com/open-sauced/insights/issues/1925)) ([a5245f7](https://github.com/open-sauced/insights/commit/a5245f758642635e359a0d60deff30aabd0ee3ad))
+
+## [1.71.0-beta.11](https://github.com/open-sauced/insights/compare/v1.71.0-beta.10...v1.71.0-beta.11) (2023-10-17)
+
+
+### 🐛 Bug Fixes
+
+* made active tab forecolor more prominent for hub navigation ([eeee241](https://github.com/open-sauced/insights/commit/eeee2411f9aa6f40517890e6576dc959b4098788))
+* made active tab forecolor more prominent for hub navigation ([#1921](https://github.com/open-sauced/insights/issues/1921)) ([fe997ed](https://github.com/open-sauced/insights/commit/fe997edd2fc781f4c2b5f7d63e2e749e3de9dbe9))
+
 ## [1.71.0-beta.10](https://github.com/open-sauced/insights/compare/v1.71.0-beta.9...v1.71.0-beta.10) (2023-10-16)
 
 

components/molecules/FilterHeader/filter-header.tsx

@@ -6,7 +6,7 @@ import ContextThumbnail from "components/atoms/ContextThumbnail/context-thumbnai
 import SuperativeSelector from "components/molecules/SuperlativeSelector/superlative-selector";
 
 import useFilterOptions from "lib/hooks/useFilterOptions";
-import { captureAnayltics } from "lib/utils/analytics";
+import { useAnalytics } from "lib/utils/analytics";
 import useFilterPrefetch from "lib/hooks/useFilterPrefetch";
 import topicNameFormatting from "lib/utils/topic-name-formatting";
 import FilterCardSelect from "components/molecules/FilterCardSelect/filter-card-select";
@@ -16,13 +16,14 @@ import { getInterestOptions } from "lib/utils/getInterestOptions";
 
 const HeaderFilter = () => {
   const router = useRouter();
+  const { captureAnalytics } = useAnalytics();
   const filterOptions = useFilterOptions();
   const topicOptions = getInterestOptions();
 
   const { filterValues } = useFilterPrefetch();
   const { filterName, toolName, selectedFilter } = router.query;
   const filterBtnRouting = (filter: string) => {
-    captureAnayltics("Filters", "toolsFilter", `${filter} applied`);
+    captureAnalytics({ title: "Filters", property: "toolsFilter", value: `${filter} applied` });
     return router.push(`/${filterName}/${toolName}/filter/${filter.toLocaleLowerCase()}`);
   };
 

components/organisms/ToolsDisplay/tools-display.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { captureAnayltics } from "lib/utils/analytics";
+import { useAnalytics } from "lib/utils/analytics";
 import useSession from "lib/hooks/useSession";
 import Contributors from "../Contributors/contributors";
 import Dashboard from "../Dashboard/dashboard";
@@ -13,7 +13,9 @@ interface ToolProps {
 
 const Tool = ({ tool, repositories }: ToolProps): JSX.Element => {
   const { hasReports, waitlisted } = useSession();
-  captureAnayltics("Tools Display", "tools", `${tool} selected`);
+  const { captureAnalytics } = useAnalytics();
+
+  captureAnalytics({ title: "Tools Display", property: "tools", value: `${tool} selected` });
 
   switch (tool) {
     case "Dashboard":

components/organisms/UserSettingsPage/user-settings-page.tsx

@@ -51,6 +51,7 @@ const UserSettingsPage = ({ user }: userSettingsPageProps) => {
   const [timezone, setTimezone] = useState("");
   const [userInfo, setUserInfo] = useState<DbUser>();
   const [email, setEmail] = useState<string | undefined>("");
+  const [bio, setBio] = useState("");
   const [emailPreference, setEmailPreference] = useState<EmailPreferenceType>({
     // eslint-disable-next-line camelcase
     display_email: false,
@@ -71,7 +72,7 @@ const UserSettingsPage = ({ user }: userSettingsPageProps) => {
       setEmail(response.email);
       setDisplayLocalTime(response.display_local_time);
       setCoupon(response.coupon_code);
-      formRef.current!.bio.value = response.bio;
+      setBio(response.bio);
       formRef.current!.url.value = response.url;
       formRef.current!.twitter_username.value = response.twitter_username;
       formRef.current!.company.value = response.company;
@@ -162,7 +163,7 @@ const UserSettingsPage = ({ user }: userSettingsPageProps) => {
     const payload: UpdateUserPayload = {
       name: formRef.current!.nameInput.value,
       email,
-      bio: formRef.current!.bio.value,
+      bio,
       // eslint-disable-next-line camelcase
       twitter_username: formRef.current!.twitter_username.value,
       company: formRef.current!.company.value,
@@ -227,7 +228,18 @@ const UserSettingsPage = ({ user }: userSettingsPageProps) => {
                 placeholder="Tell us about yourself."
                 className="px-3 py-2 rounded-lg bg-light-slate-4 disabled:cursor-not-allowed "
                 name="bio"
+                value={bio}
+                onChange={(e) => setBio(e.target.value)}
               ></textarea>
+              {bio?.length > 255 ? (
+                <p aria-live="assertive" className="text-light-red-10 text-xs">
+                  Bio too long
+                </p>
+              ) : (
+                <p aria-live="polite" className="text-xs">
+                  {bio?.length}/255
+                </p>
+              )}
             </div>
             <TextInput
               className="font-medium bg-light-slate-4 text-light-slate-11"

layouts/hub.tsx

@@ -24,7 +24,7 @@ const HubLayout = ({ children }: { children: React.ReactNode }) => {
   const router = useRouter();
 
   const validatePath = (path: string) => {
-    const PATHREGEX = /^\/hub\/(insights|lists)(\/(new|[\d]+\/edit))?$/;
+    const PATHREGEX = /^\/hub\/(insights|lists)?$/;
 
     return PATHREGEX.test(path);
   };
@@ -48,7 +48,7 @@ const HubLayout = ({ children }: { children: React.ReactNode }) => {
   }, [router, onboarded]);
 
   const getActiveLinkClassNames = (href: string) => {
-    return router.pathname === href ? "text-light-slate-11" : "text-slate-300";
+    return router.pathname === href ? "text-light-slate-12" : "text-slate-300";
   };
 
   return (

lib/utils/analytics.ts

@@ -1,16 +1,41 @@
 import posthog from "posthog-js";
+import useSupabaseAuth from "lib/hooks/useSupabaseAuth";
+
+interface AnalyticEvent {
+  title: string;
+  property: string;
+  value: string;
+}
 
 function initiateAnalytics() {
   // eslint-disable-next-line
   posthog.init(process.env.NEXT_PUBLIC_POSTHOG_ID as string, { api_host: "https://app.posthog.com" });
 }
 
-function captureAnayltics(analyticsTitle: string, analyticsProperty: string, analyticsValue: string) {
-  const analyticsObject: Record<string, string> = {};
+/**
+ * Captures an analytic event
+ *
+ * @param {string} title - The title of the event
+ * @param {string} property - The property of the event
+ * @param {string} value - The value of the event
+ */
+function useAnalytics() {
+  const { user } = useSupabaseAuth();
+
+  return {
+    captureAnalytics({ title, property, value }: AnalyticEvent) {
+      const analyticsObject: Record<string, string> = {};
+
+      analyticsObject[property] = value;
 
-  analyticsObject[analyticsProperty] = analyticsValue;
+      // if a user is not logged in, Posthog will generate an anonymous ID
+      if (user) {
+        posthog.identify(user.user_metadata.sub);
+      }
 
-  posthog.capture(analyticsTitle, analyticsObject);
+      posthog.capture(title, analyticsObject);
+    },
+  };
 }
 
-export { initiateAnalytics, captureAnayltics };
+export { initiateAnalytics, useAnalytics };

package.json

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

pages/start.tsx

@@ -25,7 +25,7 @@ import Button from "components/atoms/Button/button";
 import useSupabaseAuth from "lib/hooks/useSupabaseAuth";
 import { setQueryParams } from "lib/utils/query-params";
 import useSession from "lib/hooks/useSession";
-import { captureAnayltics } from "lib/utils/analytics";
+import { useAnalytics } from "lib/utils/analytics";
 
 import useStore from "lib/store";
 import { getInterestOptions } from "lib/utils/getInterestOptions";
@@ -45,7 +45,13 @@ interface LoginStep1Props {
 }
 
 const LoginStep1: React.FC<LoginStep1Props> = ({ user }) => {
-  captureAnayltics("User Onboarding", "onboardingStep1", "visited");
+  const { captureAnalytics } = useAnalytics();
+
+  captureAnalytics({
+    title: "User Onboarding",
+    property: "onboardingStep1",
+    value: "visited",
+  });
 
   const router = useRouter();
   const { onboarded } = useSession();
@@ -115,10 +121,15 @@ interface LoginStep2Props {
 }
 
 const LoginStep2: React.FC<LoginStep2Props> = ({ handleUpdateInterests: handleUpdateInterestsParent }) => {
+  const { captureAnalytics } = useAnalytics();
   const [selectedInterests, setSelectedInterests] = useState<string[]>([]);
   const interestArray = getInterestOptions();
 
-  captureAnayltics("User Onboarding", "onboardingStep2", "visited");
+  captureAnalytics({
+    title: "User Onboarding",
+    property: "onboardingStep2",
+    value: "visited",
+  });
 
   const handleSelectInterest = (interest: string) => {
     if (selectedInterests.length > 0 && selectedInterests.includes(interest)) {
@@ -175,7 +186,13 @@ interface LoginStep3Props {
 }
 
 const LoginStep3: React.FC<LoginStep3Props> = ({ interests, user }) => {
-  captureAnayltics("User Onboarding", "onboardingStep3", "visited");
+  const { captureAnalytics } = useAnalytics();
+
+  captureAnalytics({
+    title: "User Onboarding",
+    property: "onboardingStep3",
+    value: "visited",
+  });
   const store = useStore();
   const router = useRouter();
   const { sessionToken } = useSupabaseAuth();