@imksh/create 1.0.24 → 1.0.26

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@imksh/create",
-  "version": "1.0.24",
+  "version": "1.0.26",
   "description": "A production-ready create for scaffolding modern applications.",
   "type": "module",
   "bin": {

package/src/commands/create.js

@@ -38,7 +38,8 @@ export default async function createCommand(projectName, options) {
     'next',
     'next-ts',
     'react-native',
-    'mern-react-native'
+    'mern-react-native',
+    'production-fullstack'
   ];
   if (!validTemplates.includes(template)) {
     throw new Error(`Invalid template "${template}". Valid templates are: ${validTemplates.join(', ')}`);

package/src/index.js

@@ -24,7 +24,7 @@ program
   .argument("<project-name>", "Name of the project")
   .option(
     "-t, --template <template>",
-    "Template to use (react, react-ts, node, node-ts, node-prisma, node-prisma-ts, mern, mern-ts, next, next-ts, react-native, mern-react-native)",
+    "Template to use (react, react-ts, node, node-ts, node-prisma, node-prisma-ts, mern, mern-ts, next, next-ts, react-native, mern-react-native, production-fullstack)",
   )
   .option("--skip-install", "Skip installing dependencies")
   .option("--no-git", "Skip initializing a git repository")

package/src/utils/askTemplate.js

@@ -13,6 +13,7 @@ export async function askTemplate() {
         { name: 'React Native', value: 'react-native' },
         { name: 'MERN + React Native', value: 'mern-react-native' },
         { name: 'Next.js', value: 'next' },
+        { name: 'Production Fullstack', value: 'production-fullstack' },
       ],
     },
   ]);

package/templates/mern-react-native/client/src/vite-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />

package/templates/mern-react-native/mobile/_gitignore

@@ -0,0 +1,43 @@
+# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files
+
+# dependencies
+node_modules/
+
+# Expo
+.expo/
+dist/
+web-build/
+expo-env.d.ts
+
+# Native
+.kotlin/
+*.orig.*
+*.jks
+*.p8
+*.p12
+*.key
+*.mobileprovision
+
+# Metro
+.metro-health-check*
+
+# debug
+npm-debug.*
+yarn-debug.*
+yarn-error.*
+
+# macOS
+.DS_Store
+*.pem
+
+# local env files
+.env*.local
+
+# typescript
+*.tsbuildinfo
+
+example
+
+# generated native folders
+/ios
+/android

package/templates/mern-react-native/mobile/babel.config.js

@@ -6,6 +6,7 @@ module.exports = function (api) {
       "nativewind/babel",
     ],
     plugins: [
+      ["inline-import", { "extensions": [".sql"] }],
       "react-native-reanimated/plugin" 
     ],
   };

package/templates/mern-react-native/mobile/drizzle.config.ts

@@ -0,0 +1,8 @@
+import type { Config } from 'drizzle-kit';
+
+export default {
+  schema: './src/db/schema.ts',
+  out: './drizzle',
+  dialect: 'sqlite',
+  driver: 'expo',
+} satisfies Config;

package/templates/mern-react-native/mobile/expo-env.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="expo/types" />
+
+// NOTE: This file should not be edited and should be in your git ignore

package/templates/mern-react-native/mobile/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "mobile",
+  "name": "shivAi",
   "main": "expo-router/entry",
   "version": "1.0.0",
   "dependencies": {
@@ -11,6 +11,7 @@
     "@react-navigation/bottom-tabs": "^7.18.10",
     "axios": "^1.18.1",
     "babel-preset-expo": "^57.0.3",
+    "drizzle-orm": "^0.45.2",
     "expo": "~57.0.7",
     "expo-blur": "~57.0.2",
     "expo-constants": "~57.0.6",
@@ -18,10 +19,13 @@
     "expo-font": "~57.0.1",
     "expo-glass-effect": "~57.0.1",
     "expo-image": "~57.0.1",
+    "expo-image-picker": "^57.0.6",
+    "expo-linear-gradient": "^57.0.1",
     "expo-linking": "~57.0.3",
     "expo-notifications": "~57.0.6",
     "expo-router": "~57.0.7",
     "expo-splash-screen": "~57.0.4",
+    "expo-sqlite": "^57.0.1",
     "expo-status-bar": "~57.0.1",
     "expo-symbols": "~57.0.1",
     "expo-system-ui": "~57.0.1",
@@ -45,11 +49,14 @@
     "react-native-toast-message": "^2.4.0",
     "react-native-web": "~0.21.0",
     "react-native-worklets": "0.10.0",
+    "socket.io-client": "^4.8.3",
     "tailwindcss": "^3.4.19",
     "zustand": "^5.0.14"
   },
   "devDependencies": {
     "@types/react": "~19.2.2",
+    "babel-plugin-inline-import": "^3.0.0",
+    "drizzle-kit": "^0.31.10",
     "eslint": "^9.0.0",
     "eslint-config-expo": "~57.0.0",
     "typescript": "~6.0.3"

package/templates/mern-react-native/mobile/src/app/(auth)/_layout.tsx

@@ -0,0 +1,12 @@
+import { Stack } from 'expo-router';
+
+export default function AuthLayout() {
+  return (
+    <Stack screenOptions={{ headerShown: false }}>
+      <Stack.Screen name="login" />
+      <Stack.Screen name="forgot-password" />
+      <Stack.Screen name="edit-profile" options={{ presentation: 'modal' }} />
+      <Stack.Screen name="change-password" options={{ presentation: 'modal' }} />
+    </Stack>
+  );
+}

package/templates/mern-react-native/mobile/src/app/(auth)/change-password.tsx

@@ -0,0 +1,112 @@
+import React, { useState , useCallback } from "react";
+import { View } from "react-native";
+import { useAuthStore } from "../../store/useAuthStore";
+import { Txt } from "../../components/common/Typography";
+import { router, useFocusEffect } from "expo-router";
+import ScrollContainer from "../../components/ui/layout/ScrollContainer";
+import Input from "../../components/ui/inputs/Input";
+import Button from "../../components/ui/buttons/Button";
+import ScreenHeader from "@/components/common/ScreenHeader";
+
+export default function ChangePasswordScreen() {
+  const { changePassword, loading, error, clearError } = useAuthStore();
+
+  useFocusEffect(
+    useCallback(() => {
+      return () => clearError();
+    }, [clearError])
+  );
+
+  const [oldPassword, setOldPassword] = useState("");
+  const [newPassword, setNewPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
+
+  const [showOldPassword, setShowOldPassword] = useState(false);
+  const [showNewPassword, setShowNewPassword] = useState(false);
+  const [showConfirmPassword, setShowConfirmPassword] = useState(false);
+
+  const [validationError, setValidationError] = useState("");
+
+  const handleSave = async () => {
+    setValidationError("");
+    if (!oldPassword || !newPassword || !confirmPassword) {
+      setValidationError("Please fill all fields");
+      return;
+    }
+
+    if (newPassword !== confirmPassword) {
+      setValidationError("New passwords do not match");
+      return;
+    }
+
+    const success = await changePassword(oldPassword, newPassword);
+    if (success) {
+      router.back();
+    }
+  };
+
+  return (
+    <>
+      <ScreenHeader title="Change Password" />
+      <ScrollContainer
+        contentContainerStyle={{
+          flexGrow: 1,
+          padding: 16,
+        }}
+        className="bg-base-100"
+      >
+        {error || validationError ? (
+          <View className="bg-error/10 border border-error/20 rounded-2xl p-3 mb-4">
+            <Txt variant="md" className="text-error text-xs text-center">
+              ⚠️ {validationError || error}
+            </Txt>
+          </View>
+        ) : null}
+
+        <View className="gap-4">
+          <Input
+            leftIcon="lock-closed"
+            rightIcon={showOldPassword ? "eye-off" : "eye"}
+            onRightIconPress={() => setShowOldPassword(!showOldPassword)}
+            placeholder="Current Password"
+            value={oldPassword}
+            onChangeText={setOldPassword}
+            secureTextEntry={!showOldPassword}
+          />
+
+          <Input
+            leftIcon="key"
+            rightIcon={showNewPassword ? "eye-off" : "eye"}
+            onRightIconPress={() => setShowNewPassword(!showNewPassword)}
+            placeholder="New Password"
+            value={newPassword}
+            onChangeText={setNewPassword}
+            secureTextEntry={!showNewPassword}
+          />
+
+          <Input
+            leftIcon="checkmark-circle"
+            rightIcon={showConfirmPassword ? "eye-off" : "eye"}
+            onRightIconPress={() =>
+              setShowConfirmPassword(!showConfirmPassword)
+            }
+            placeholder="Confirm New Password"
+            value={confirmPassword}
+            onChangeText={setConfirmPassword}
+            secureTextEntry={!showConfirmPassword}
+          />
+
+          <View className="mt-4">
+            <Button
+              label="Update Password"
+              onPress={handleSave}
+              isLoading={loading}
+              variant="primary"
+              isFullWidth
+            />
+          </View>
+        </View>
+      </ScrollContainer>
+    </>
+  );
+}

package/templates/mern-react-native/mobile/src/app/(auth)/edit-profile.tsx

@@ -0,0 +1,156 @@
+import React, { useState , useCallback } from "react";
+import { View, TouchableOpacity } from "react-native";
+import { useAuthStore } from "../../store/useAuthStore";
+import { Txt } from "../../components/common/Typography";
+import { router, useFocusEffect } from "expo-router";
+import { Ionicons } from "@expo/vector-icons";
+import ImagePickerModal from "../../components/ui/inputs/ImagePickerModal";
+import Avatar from "../../components/ui/data-display/Avatar";
+
+import ScrollContainer from "../../components/ui/layout/ScrollContainer";
+import Input from "../../components/ui/inputs/Input";
+import Button from "../../components/ui/buttons/Button";
+import ScreenHeader from "@/components/common/ScreenHeader";
+import { toast } from "@/utils/toast";
+import { authService } from "@/services/auth.service";
+
+export default function EditProfileScreen() {
+  const { user, error, setUser, clearError } = useAuthStore();
+  const [loading, setLoading] = useState(false);
+
+  useFocusEffect(
+    useCallback(() => {
+      return () => clearError();
+    }, [clearError])
+  );
+
+  const [name, setName] = useState(user?.name || "");
+  const [phone, setPhone] = useState(user?.phone || "");
+  const [avatarUri, setAvatarUri] = useState<string | null>(null);
+  const [isImagePickerOpen, setIsImagePickerOpen] = useState(false);
+
+  const handleSave = async () => {
+    const formData = new FormData();
+    try {
+      setLoading(true);
+      if (name !== user?.name) formData.append("name", name);
+      if (phone !== user?.phone) formData.append("phone", phone);
+
+      if (avatarUri) {
+        const filename = avatarUri.split("/").pop() || "avatar.jpg";
+        const match = /\.(\w+)$/.exec(filename);
+        const type = match ? `image/${match[1]}` : `image`;
+
+        formData.append("file", {
+          uri: avatarUri,
+          name: filename,
+          type,
+        } as any);
+      }
+
+      // Only update if something changed
+      if (
+        (formData as any).getParts &&
+        (formData as any).getParts().length === 0
+      ) {
+        router.back();
+        return;
+      }
+
+      const res = await authService.updateMe(formData);
+      if (res.data.success) {
+        setUser(res.data.data);
+        toast.success("Profile updated successfully");
+        router.back();
+      } else {
+        toast.error(res.data.message);
+      }
+
+      console.log(res.data.data);
+    } catch (error: any) {
+      toast.error(error.response?.data?.message || error.message);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <>
+      <ScreenHeader title="Edit Profile" />
+      <ScrollContainer
+        contentContainerStyle={{
+          flexGrow: 1,
+          padding: 16,
+        }}
+        className="bg-base-100"
+      >
+        <View className="items-center mb-8">
+          <View className="relative">
+            <View className="w-28 h-28 rounded-full items-center justify-center border-4 border-base-100 shadow-sm shadow-base-content/20 overflow-hidden">
+              {avatarUri ? (
+                <Avatar url={avatarUri} size={104} />
+              ) : (
+                <Avatar
+                  url={
+                    user?.avatar?.url ||
+                    `https://placehold.co/600x400?text=${user?.name?.charAt(0).toUpperCase() || "U"}`
+                  }
+                  size={104}
+                />
+              )}
+            </View>
+            <TouchableOpacity
+              onPress={() => setIsImagePickerOpen(true)}
+              className="absolute bottom-0 right-0 bg-primary p-2 rounded-full border-2 border-base-100"
+            >
+              <Ionicons name="camera" size={18} color="#fff" />
+            </TouchableOpacity>
+          </View>
+        </View>
+
+        {error ? (
+          <View className="bg-error/10 border border-error/20 rounded-2xl p-3 mb-4">
+            <Txt variant="md" className="text-error text-xs text-center">
+              ⚠️ {error}
+            </Txt>
+          </View>
+        ) : null}
+
+        <View className="gap-4">
+          <Input
+            leftIcon="person"
+            placeholder="Full name"
+            value={name}
+            onChangeText={setName}
+          />
+
+          <Input
+            leftIcon="call"
+            placeholder="Phone number"
+            value={phone}
+            onChangeText={setPhone}
+            keyboardType="phone-pad"
+          />
+
+          <View className="mt-4">
+            <Button
+              label="Save Changes"
+              onPress={handleSave}
+              isLoading={loading}
+              variant="primary"
+              isFullWidth
+            />
+          </View>
+        </View>
+      </ScrollContainer>
+      <ImagePickerModal
+        isOpen={isImagePickerOpen}
+        onClose={() => setIsImagePickerOpen(false)}
+        onImageSelected={(image) => setAvatarUri(image.uri)}
+        allowsEditing
+        title="Profile Picture"
+        subtitle="Choose a new profile picture"
+      />
+    </>
+  );
+}

package/templates/mern-react-native/mobile/src/app/(auth)/forgot-password.tsx

@@ -0,0 +1,191 @@
+import React, { useState, useEffect , useCallback } from "react";
+import { View } from "react-native";
+import { useAuthStore } from "../../store/useAuthStore";
+import { Txt } from "../../components/common/Typography";
+import { router, useFocusEffect } from "expo-router";
+import ScrollContainer from "../../components/ui/layout/ScrollContainer";
+import Input from "../../components/ui/inputs/Input";
+import Button from "../../components/ui/buttons/Button";
+
+export default function ForgotPasswordScreen() {
+  const { genOtp, verifyOtp, resetPassword, loading, error, clearError } = useAuthStore();
+  const [step, setStep] = useState<"email" | "otp" | "password">("email");
+
+  useFocusEffect(
+    useCallback(() => {
+      return () => clearError();
+    }, [clearError])
+  );
+
+  const [email, setEmail] = useState("");
+  const [otp, setOtp] = useState("");
+  const [newPassword, setNewPassword] = useState("");
+  const [showPassword, setShowPassword] = useState(false);
+
+  const [timer, setTimer] = useState(0);
+
+  useEffect(() => {
+    let interval: ReturnType<typeof setInterval>;
+    if (timer > 0) {
+      interval = setInterval(() => {
+        setTimer((prev) => prev - 1);
+      }, 1000);
+    }
+    return () => clearInterval(interval);
+  }, [timer]);
+
+  const handleSendOtp = async () => {
+    if (!email) return;
+    const success = await genOtp(email);
+    if (success) {
+      setStep("otp");
+      setTimer(60);
+    }
+  };
+
+  const handleVerifyOtp = async () => {
+    if (!otp) return;
+    const success = await verifyOtp(email, otp);
+    if (success) {
+      setStep("password");
+    }
+  };
+
+  const handleResetPassword = async () => {
+    if (!newPassword) return;
+    const success = await resetPassword(newPassword);
+    if (success) {
+      router.replace("/(auth)/login");
+    }
+  };
+
+  return (
+    <ScrollContainer
+      contentContainerStyle={{
+        flexGrow: 1,
+        justifyContent: "center",
+        padding: 16,
+      }}
+      className="bg-base-100"
+    >
+      <View className="w-full p-6">
+        <View className="items-center mb-8 w-full">
+          <Txt variant="xl" className="text-2xl mb-1 text-center">
+            {step === "email" && "Forgot Password"}
+            {step === "otp" && "Verify Email"}
+            {step === "password" && "Reset Password"}
+          </Txt>
+          <Txt
+            variant="sm"
+            className="text-xs text-base-content/50 text-center px-2"
+          >
+            {step === "email" && "Enter your email to receive an OTP"}
+            {step === "otp" && `Enter the OTP sent to ${email}`}
+            {step === "password" && "Enter your new password"}
+          </Txt>
+        </View>
+
+        {error ? (
+          <View className="bg-error/10 border border-error/20 rounded-2xl p-3 mb-4">
+            <Txt variant="md" className="text-error text-xs text-center">
+              ⚠️ {error}
+            </Txt>
+          </View>
+        ) : null}
+
+        <View className="gap-2">
+          {step === "email" && (
+            <>
+              <Input
+                leftIcon="mail"
+                placeholder="Email address"
+                value={email}
+                onChangeText={setEmail}
+                autoCapitalize="none"
+                keyboardType="email-address"
+              />
+              <View className="mt-2">
+                <Button
+                  label="Send OTP →"
+                  onPress={handleSendOtp}
+                  isLoading={loading}
+                  variant="primary"
+                  isFullWidth
+                />
+              </View>
+            </>
+          )}
+
+          {step === "otp" && (
+            <>
+              <Input
+                leftIcon="key"
+                placeholder="Enter OTP"
+                value={otp}
+                onChangeText={setOtp}
+                keyboardType="numeric"
+              />
+              <View className="mt-2">
+                <Button
+                  label="Verify OTP →"
+                  onPress={handleVerifyOtp}
+                  isLoading={loading}
+                  variant="primary"
+                  isFullWidth
+                />
+              </View>
+              <View className="mt-4">
+                <Button
+                  label={timer > 0 ? `Resend OTP in ${timer}s` : "Resend OTP"}
+                  onPress={handleSendOtp}
+                  disabled={timer > 0 || loading}
+                  variant="outline"
+                  isFullWidth
+                />
+              </View>
+            </>
+          )}
+
+          {step === "password" && (
+            <>
+              <Input
+                leftIcon="lock-closed"
+                rightIcon={showPassword ? "eye-off" : "eye"}
+                onRightIconPress={() => setShowPassword(!showPassword)}
+                placeholder="New Password"
+                value={newPassword}
+                onChangeText={setNewPassword}
+                secureTextEntry={!showPassword}
+              />
+              <View className="mt-2">
+                <Button
+                  label="Reset Password →"
+                  onPress={handleResetPassword}
+                  isLoading={loading}
+                  variant="primary"
+                  isFullWidth
+                />
+              </View>
+            </>
+          )}
+        </View>
+
+        <View className="mt-8">
+          <Txt
+            variant="sm"
+            className="text-sm text-base-content/50 text-center"
+          >
+            Remember your password?{" "}
+            <Txt
+              variant="md"
+              className="text-primary text-sm"
+              onPress={() => router.push("/(auth)/login")}
+            >
+              Sign in
+            </Txt>
+          </Txt>
+        </View>
+      </View>
+    </ScrollContainer>
+  );
+}