Chore: add icons to urls that have isBlank

src/components/tools/BobAchievements/BobAchievements.tsx

@@ -39,7 +39,7 @@ const BobAchievements: FC<BobAchievementsProps> = ({
           <span className={styles.category}>{t.category} </span>
         </div>
         <div className={styles.conversations}>
-          <span className={styles.value}> 3906</span>
+          <span className={styles.value}> 3900+</span>
           <span className={styles.category}>{t.conversations} </span>
         </div>
       </div>

src/components/tools/ToolContainer/ToolContainer.tsx

@@ -28,7 +28,6 @@ const ToolContainer: FC<ToolContainerProps> = ({
   description = 'Modular management framework for remote-first software development companies, distilled from founding four successful software firms.',
   poweredBy,
   link,
-  isBlank = false,
   isDarkTheme = false,
   isInDevelopment = false,
 }) => {
@@ -38,7 +37,8 @@ const ToolContainer: FC<ToolContainerProps> = ({
   const t = toolsData[locale as keyof typeof toolsData] ?? toolsData.en;
 
   const config = id ? TOOL_CONFIG[id] : undefined;
-  const { Icon, hoverColor, darkHoverColor, darkIconFill } = config ?? {};
+  const { Icon, hoverColor, darkHoverColor, darkIconFill, isBlank } =
+    config ?? {};
 
   const isClaude = poweredBy === 'Claude';
   const isChatGPT = poweredBy === 'ChatGPT';

src/components/tools/ToolContainer/ToolContainer.types.ts

@@ -3,8 +3,8 @@ export type ToolContainerProps = {
   title?: string;
   description?: string;
   poweredBy?: 'Claude' | 'ChatGPT' | string;
-  isBlank?: boolean;
   isDarkTheme?: boolean;
   isInDevelopment?: boolean;
+  isBlank?: boolean;
   link?: string;
 };

src/constants/tools.ts

@@ -13,6 +13,7 @@ export type ToolConfig = {
   hoverColor: string;
   darkHoverColor: string;
   darkIconFill: string;
+  isBlank: boolean;
 };
 
 export const TOOL_CONFIG: Record<number, ToolConfig> = {
@@ -21,42 +22,49 @@ export const TOOL_CONFIG: Record<number, ToolConfig> = {
     hoverColor: '#3F4A7A',
     darkHoverColor: '#C1D6FF',
     darkIconFill: '#C1D6FF',
+    isBlank: false,
   },
   2: {
     Icon: EmaIcon,
     hoverColor: '#0A3D3D',
     darkHoverColor: '#95CCCC',
     darkIconFill: '#95CCCC',
+    isBlank: false,
   },
   3: {
     Icon: MosaicIcon,
     hoverColor: '#3F4A7A',
     darkHoverColor: '#C1D6FF',
     darkIconFill: '#E08080',
+    isBlank: false,
   },
   4: {
     Icon: GithubIcon,
     hoverColor: '#4A2F63',
     darkHoverColor: '#E9D3FF',
     darkIconFill: '#E9D3FF',
+    isBlank: true,
   },
   5: {
     Icon: BobIcon,
     hoverColor: '#2F4A3E',
     darkHoverColor: '#ADD19A',
     darkIconFill: '#ADD19A',
+    isBlank: true,
   },
   6: {
     Icon: TomIcon,
     hoverColor: '#6A3A2A',
     darkHoverColor: '#EACCAA',
     darkIconFill: '#EACCAA',
+    isBlank: true,
   },
   7: {
     Icon: ClaudeBobIcon,
     hoverColor: '#B06A3A',
     darkHoverColor: '#FFB366',
     darkIconFill: '#FFB366',
+    isBlank: true,
   },
 };
 
@@ -65,4 +73,5 @@ export const DEFAULT_CONFIG: ToolConfig = {
   hoverColor: '#3F4A7A',
   darkHoverColor: '#C1D6FF',
   darkIconFill: '#C1D6FF',
+  isBlank: false,
 };

src/layouts/ToolsLayout/ToolsLayout.tsx

@@ -71,7 +71,10 @@ const ToolsLayout: FC<ToolsLayoutProps> = ({
         return;
       }
 
-      if (normalizedBuffer.endsWith(EASTER_SUBSEQUENT_CODE_NORMALIZED)) {
+      if (
+        idx > 0 &&
+        normalizedBuffer.endsWith(EASTER_SUBSEQUENT_CODE_NORMALIZED)
+      ) {
         typedBufferRef.current = '';
         setEasterThemeIndex(prev => (prev + 1) % 4);
         setTransitionKey(prev => prev + 1);

src/pages/tools/index.tsx

@@ -75,7 +75,6 @@ const ToolsPage: FC<ToolsPageProps> = ({ tools }) => {
               title={title}
               description={description}
               poweredBy={attrs?.poweredBy}
-              isBlank={tool?.id === 5 || tool?.id === 6}
               isInDevelopment={attrs?.isInDevelopment ?? false}
             />
           );