HugeIcons direct component import

Author: codeAbinash

.prettierignore

@@ -1 +1,2 @@
-src/rpc/
+src/rpc/
+src/assets/icons/hugeicons/

App.tsx

@@ -1,23 +1,24 @@
 import { devOptStore } from '@/zustand/devOptStore'
-import { CodeSolidIcon } from '@assets/icons/icons'
 import { Popups } from '@components/Popup'
 import Press from '@components/Press'
 import { AutoStatusBar } from '@components/StatusBar'
+import CodeIcon from '@hugeicons/CodeIcon'
 import { queryClient } from '@query/index'
 import { NavigationContainer, useNavigation } from '@react-navigation/native'
 import { CardStyleInterpolators, createStackNavigator, type StackNavigationOptions } from '@react-navigation/stack'
 import ComputerScienceSettings from '@screens/ComputerScience/ComputerScienceSettings'
-import { LocationNoteParamList } from '@screens/LocationNotes/LocationNote'
-import LocationNotes from '@screens/LocationNotes/LocationNotes'
-import LocationNote from '@screens/LocationNotes/LocationNote'
-import LocationTags from '@screens/LocationNotes/LocationTags'
 import DeveloperOptions from '@screens/DeveloperOptions/DeveloperOptions'
 import MMKVDataEditor, { type MMKVDataEditorParamList } from '@screens/DeveloperOptions/MMKVDataEditor'
 import MMKVDataList from '@screens/DeveloperOptions/MMKVDataList'
 import Skia from '@screens/Example/Skia'
 import Explore from '@screens/Explore/Explore'
 import Greeting from '@screens/Home/Greeting'
 import fabStyles from '@screens/Home/styles/fabStyles'
+import LocationNote, { LocationNoteParamList } from '@screens/LocationNotes/LocationNote'
+import LocationNotes from '@screens/LocationNotes/LocationNotes'
+import LocationTags from '@screens/LocationNotes/LocationTags'
+import NewLocationNote from '@screens/LocationNotes/NewLocationNote'
+import LocationSpeed from '@screens/LocationSpeed/LocationSpeed'
 import NotesWelcome from '@screens/Notes/NotesWelcome'
 import type { ChartParamList } from '@screens/OS/Chart'
 import Chart from '@screens/OS/Chart'
@@ -62,8 +63,6 @@ import { Dimensions, SafeAreaView, useColorScheme } from 'react-native'
 import { GestureHandlerRootView } from 'react-native-gesture-handler'
 import Animated, { ZoomIn, ZoomOut } from 'react-native-reanimated'
 import './global.css'
-import NewLocationNote from '@screens/LocationNotes/NewLocationNote'
-import LocationSpeed from '@screens/LocationSpeed/LocationSpeed'
 
 function App(): React.JSX.Element {
   const scheme = useColorScheme()
@@ -294,7 +293,7 @@ const FabButton = () => {
         activeScale={0.95}
         className='items-center justify-center rounded-full bg-accent'
       >
-        <CodeSolidIcon color={'white'} height={25} width={25} />
+        <CodeIcon color={'white'} size={25} />
       </Press>
     </Animated.View>
   )

ic.ts

@@ -0,0 +1,72 @@
+import { execSync } from 'node:child_process'
+import { readdirSync, statSync } from 'node:fs'
+import { join } from 'node:path'
+
+// Function to recursively get all .svg files in a directory
+function getSvgFiles(directory: string): string[] {
+  const files: string[] = []
+
+  const items = readdirSync(directory)
+
+  for (const item of items) {
+    const fullPath = join(directory, item)
+    const stats = statSync(fullPath)
+
+    if (stats.isDirectory()) {
+      files.push(...getSvgFiles(fullPath))
+    } else if (item.endsWith('.svg')) {
+      files.push(fullPath)
+    }
+  }
+
+  return files
+}
+
+// Function to transform filename by removing last two words and .svg extension
+function transformFilename(filePath: string): string {
+  const fileName = filePath.split('/').pop()?.split('\\').pop() ?? ''
+
+  // Remove .svg extension first
+  const nameWithoutExt = fileName.replace('.svg', '')
+
+  // Split by underscores or hyphens to get words
+  const separator = nameWithoutExt.includes('-') ? '-' : '_'
+  const words = nameWithoutExt.split(separator)
+
+  // Remove the last two words if there are at least 3 words
+  if (words.length >= 3) {
+    words.splice(-2)
+  }
+
+  // Join the remaining words
+  return words.join(separator)
+}
+
+// Main function
+async function main() {
+  try {
+    const iconsDir = join(process.cwd(), 'src', 'assets', 'icons', 'src')
+    const svgFiles = getSvgFiles(iconsDir)
+
+    console.log(`Found ${svgFiles.length} SVG files in the icons directory.`)
+
+    for (const file of svgFiles) {
+      const transformedName = transformFilename(file)
+      console.log(`Processing ${file} -> ${transformedName}`)
+
+      try {
+        // Run the ic command with the transformed filename
+        execSync(`ic ${transformedName}`, { stdio: 'inherit' })
+      } catch (error) {
+        console.error(`Failed to process ${file}:`, error)
+      }
+    }
+
+    console.log('Processing completed.')
+  } catch (error) {
+    console.error('An error occurred:', error)
+    process.exit(1)
+  }
+}
+
+main()

src/assets/icons/hugeicons/Add01Icon.tsx

@@ -1,9 +1,9 @@
 
 import React from 'react'
-import Svg, { Circle, ClipPath, Defs, Ellipse, G, Line, LinearGradient, Mask, Path, Polygon, Polyline, RadialGradient, Rect, Stop } from 'react-native-svg'
-import { Variant, IconProps, defaultStrokeWidth, defaultVariant, defaultColor, defaultSize } from './constants'
+import Svg, { Path } from 'react-native-svg'
+import { HugeIconProps, Variant, defaultColor, defaultSize, defaultStrokeWidth, defaultVariant } from './constants'
 
-const iconMap: Record<Variant, React.FC<IconProps>> = {
+const iconMap: Record<Variant, React.FC<HugeIconProps>> = {
 	'stroke-rounded': StrokeRounded,
 	'stroke-standard': StrokeStandard,
 	'solid-standard': SolidStandard,
@@ -15,75 +15,75 @@ const iconMap: Record<Variant, React.FC<IconProps>> = {
 	'solid-sharp': SolidSharp,
 }
 
-export default function Add01Icon({ variant, ...rest }: IconProps) {
+export default function Add01Icon({ variant, ...rest }: HugeIconProps) {
   const Component = iconMap[variant || defaultVariant]
   return <Component {...rest} />
 }
 
-function StrokeRounded({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: IconProps) {
+function StrokeRounded({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: HugeIconProps) {
   return (<Svg className={className} style={style} width={size} height={size} viewBox="0 0 24 24" fill="none">
 <Path d="M12 4V20" stroke={color} strokeWidth={strokeWidth} strokeLinecap="round" strokeLinejoin="round"/>
 <Path d="M4 12H20" stroke={color} strokeWidth={strokeWidth} strokeLinecap="round" strokeLinejoin="round"/>
 </Svg>
 )
 }
 
-function StrokeStandard({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: IconProps) {
+function StrokeStandard({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: HugeIconProps) {
   return (<Svg className={className} style={style} width={size} height={size} viewBox="0 0 24 24" fill="none">
 <Path d="M12 4V20" stroke={color} strokeWidth={strokeWidth} strokeLinecap="round" strokeLinejoin="round"/>
 <Path d="M4 12H20" stroke={color} strokeWidth={strokeWidth} strokeLinecap="round" strokeLinejoin="round"/>
 </Svg>
 )
 }
 
-function SolidStandard({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: IconProps) {
+function SolidStandard({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: HugeIconProps) {
   return (<Svg className={className} style={style} width={size} height={size} viewBox="0 0 24 24" fill="none">
 <Path fillRule="evenodd" clipRule="evenodd" d="M12 2.75C12.6904 2.75 13.25 3.30964 13.25 4V20C13.25 20.6904 12.6904 21.25 12 21.25C11.3096 21.25 10.75 20.6904 10.75 20V4C10.75 3.30964 11.3096 2.75 12 2.75Z" fill={color}/>
 <Path fillRule="evenodd" clipRule="evenodd" d="M2.75 12C2.75 11.3096 3.30964 10.75 4 10.75H20C20.6904 10.75 21.25 11.3096 21.25 12C21.25 12.6904 20.6904 13.25 20 13.25H4C3.30964 13.25 2.75 12.6904 2.75 12Z" fill={color}/>
 </Svg>
 )
 }
 
-function DuotoneRounded({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: IconProps) {
+function DuotoneRounded({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: HugeIconProps) {
   return (<Svg className={className} style={style} width={size} height={size} viewBox="0 0 24 24" fill="none">
 <Path opacity="0.4" d="M12 4V20M4 12H20" stroke={color} strokeWidth={strokeWidth} strokeLinecap="round" strokeLinejoin="round"/>
 </Svg>
 )
 }
 
-function TwotoneRounded({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: IconProps) {
+function TwotoneRounded({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: HugeIconProps) {
   return (<Svg className={className} style={style} width={size} height={size} viewBox="0 0 24 24" fill="none">
 <Path d="M12 4V20" stroke={color} strokeWidth={strokeWidth} strokeLinecap="round" strokeLinejoin="round"/>
 <Path opacity="0.4" d="M4 12H20" stroke={color} strokeWidth={strokeWidth} strokeLinecap="round" strokeLinejoin="round"/>
 </Svg>
 )
 }
 
-function SolidRounded({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: IconProps) {
+function SolidRounded({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: HugeIconProps) {
   return (<Svg className={className} style={style} width={size} height={size} viewBox="0 0 24 24" fill="none">
 <Path fillRule="evenodd" clipRule="evenodd" d="M12 2.75C12.6904 2.75 13.25 3.30964 13.25 4V20C13.25 20.6904 12.6904 21.25 12 21.25C11.3096 21.25 10.75 20.6904 10.75 20V4C10.75 3.30964 11.3096 2.75 12 2.75Z" fill={color}/>
 <Path fillRule="evenodd" clipRule="evenodd" d="M2.75 12C2.75 11.3096 3.30964 10.75 4 10.75H20C20.6904 10.75 21.25 11.3096 21.25 12C21.25 12.6904 20.6904 13.25 20 13.25H4C3.30964 13.25 2.75 12.6904 2.75 12Z" fill={color}/>
 </Svg>
 )
 }
 
-function BulkRounded({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: IconProps) {
+function BulkRounded({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: HugeIconProps) {
   return (<Svg className={className} style={style} width={size} height={size} viewBox="0 0 24 24" fill="none">
 <Path fillRule="evenodd" clipRule="evenodd" d="M12 2.75C12.6904 2.75 13.25 3.30964 13.25 4V20C13.25 20.6904 12.6904 21.25 12 21.25C11.3096 21.25 10.75 20.6904 10.75 20V4C10.75 3.30964 11.3096 2.75 12 2.75Z" fill={color}/>
 <Path opacity="0.4" fillRule="evenodd" clipRule="evenodd" d="M2.75 12C2.75 11.3096 3.30964 10.75 4 10.75H20C20.6904 10.75 21.25 11.3096 21.25 12C21.25 12.6904 20.6904 13.25 20 13.25H4C3.30964 13.25 2.75 12.6904 2.75 12Z" fill={color}/>
 </Svg>
 )
 }
 
-function StrokeSharp({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: IconProps) {
+function StrokeSharp({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: HugeIconProps) {
   return (<Svg className={className} style={style} width={size} height={size} viewBox="0 0 24 24" fill="none">
 <Path d="M12 4V20" stroke={color} strokeWidth={strokeWidth} strokeLinejoin="round"/>
 <Path d="M4 12H20" stroke={color} strokeWidth={strokeWidth} strokeLinejoin="round"/>
 </Svg>
 )
 }
 
-function SolidSharp({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: IconProps) {
+function SolidSharp({ size = defaultSize, color = defaultColor, strokeWidth = defaultStrokeWidth, className, style }: HugeIconProps) {
   return (<Svg className={className} style={style} width={size} height={size} viewBox="0 0 24 24" fill="none">
 <Path d="M10.75 13.25V20H13.25V13.25H20V10.75H13.25V4H10.75V10.75H4V13.25H10.75Z" fill={color}/>
 </Svg>