@maka/maka-cli 5.1.44 → 5.1.46

package/bundle/typescript/src/templates/react/kit/mui/auth0/auth-callback.js.jsx

@@ -0,0 +1,71 @@
+import React, { useEffect, useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { Box, CircularProgress, Typography, Alert } from '@mui/material';
+import AuthService from '<%= authServicePath %>';
+
+/**
+ * Auth0 Callback Component
+ *
+ * This component handles the OAuth callback from Auth0.
+ * It exchanges the authorization code for tokens and logs the user into Meteor.
+ */
+export const AuthCallback = () => {
+  const navigate = useNavigate();
+  const [error, setError] = useState(null);
+
+  useEffect(() => {
+    const handleCallback = async () => {
+      try {
+        // Handle the Auth0 callback and login to Meteor
+        await AuthService.handleAuth0Callback();
+
+        // Redirect to home page after successful login
+        navigate('/', { replace: true });
+      } catch (err) {
+        console.error('Auth0 callback error:', err);
+        setError(err instanceof Error ? err.message : 'Authentication failed');
+
+        // Redirect to login page after a delay
+        setTimeout(() => {
+          navigate('/login', { replace: true });
+        }, 3000);
+      }
+    };
+
+    handleCallback();
+  }, [navigate]);
+
+  return (
+    <Box
+      sx={{
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: 'center',
+        justifyContent: 'center',
+        minHeight: '100vh',
+        gap: 2,
+      }}
+    >
+      {error ? (
+        <>
+          <Alert severity="error" sx={{ maxWidth: 600 }}>
+            {error}
+          </Alert>
+          <Typography variant="body2" color="text.secondary">
+            Redirecting to login page...
+          </Typography>
+        </>
+      ) : (
+        <>
+          <CircularProgress size={60} />
+          <Typography variant="h6" sx={{ mt: 2 }}>
+            Completing authentication...
+          </Typography>
+          <Typography variant="body2" color="text.secondary">
+            Please wait while we log you in.
+          </Typography>
+        </>
+      )}
+    </Box>
+  );
+};

package/bundle/typescript/src/templates/react/kit/mui/auth0/auth-callback.js.tsx

@@ -0,0 +1,71 @@
+import React, { useEffect, useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { Box, CircularProgress, Typography, Alert } from '@mui/material';
+import AuthService from '<%= authServicePath %>';
+
+/**
+ * Auth0 Callback Component
+ *
+ * This component handles the OAuth callback from Auth0.
+ * It exchanges the authorization code for tokens and logs the user into Meteor.
+ */
+export const AuthCallback = () => {
+  const navigate = useNavigate();
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    const handleCallback = async () => {
+      try {
+        // Handle the Auth0 callback and login to Meteor
+        await AuthService.handleAuth0Callback();
+
+        // Redirect to home page after successful login
+        navigate('/', { replace: true });
+      } catch (err) {
+        console.error('Auth0 callback error:', err);
+        setError(err instanceof Error ? err.message : 'Authentication failed');
+
+        // Redirect to login page after a delay
+        setTimeout(() => {
+          navigate('/login', { replace: true });
+        }, 3000);
+      }
+    };
+
+    handleCallback();
+  }, [navigate]);
+
+  return (
+    <Box
+      sx={{
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: 'center',
+        justifyContent: 'center',
+        minHeight: '100vh',
+        gap: 2,
+      }}
+    >
+      {error ? (
+        <>
+          <Alert severity="error" sx={{ maxWidth: 600 }}>
+            {error}
+          </Alert>
+          <Typography variant="body2" color="text.secondary">
+            Redirecting to login page...
+          </Typography>
+        </>
+      ) : (
+        <>
+          <CircularProgress size={60} />
+          <Typography variant="h6" sx={{ mt: 2 }}>
+            Completing authentication...
+          </Typography>
+          <Typography variant="body2" color="text.secondary">
+            Please wait while we log you in.
+          </Typography>
+        </>
+      )}
+    </Box>
+  );
+};

package/bundle/typescript/src/templates/react/kit/mui/auth0/auth0-account-settings.js.jsx

@@ -0,0 +1,123 @@
+import React, { useContext, useState } from 'react';
+import {
+  Box,
+  Card,
+  CardContent,
+  Typography,
+  Button,
+  Alert,
+  CircularProgress,
+} from '@mui/material';
+import { Meteor } from 'meteor/meteor';
+import { AuthContext } from '<%= authContextPath %>';
+
+/**
+ * Auth0 Account Settings Component
+ *
+ * Displays Auth0 account status and allows linking/unlinking
+ * Auth0 account to/from the current Meteor user.
+ */
+export const Auth0AccountSettings = () => {
+  const auth = useContext(AuthContext);
+  const [loading, setLoading] = useState(false);
+  const [message, setMessage] = useState(null);
+
+  if (!auth?.currentUser) {
+    return null;
+  }
+
+  const user = Meteor.user();
+  const hasAuth0Account = Boolean(user?.services?.auth0);
+
+  const handleLinkAccount = async () => {
+    setLoading(true);
+    setMessage(null);
+
+    try {
+      const success = await auth.linkAuth0Account?.();
+      if (success) {
+        setMessage({ type: 'success', text: 'Auth0 account linked successfully!' });
+      }
+    } catch (error) {
+      setMessage({
+        type: 'error',
+        text: error instanceof Error ? error.message : 'Failed to link Auth0 account',
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const handleUnlinkAccount = async () => {
+    setLoading(true);
+    setMessage(null);
+
+    try {
+      const success = await auth.unlinkAuth0Account?.();
+      if (success) {
+        setMessage({ type: 'success', text: 'Auth0 account unlinked successfully!' });
+      }
+    } catch (error) {
+      setMessage({
+        type: 'error',
+        text: error instanceof Error ? error.message : 'Failed to unlink Auth0 account',
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <Card>
+      <CardContent>
+        <Typography variant="h6" gutterBottom>
+          Auth0 Integration
+        </Typography>
+
+        {message && (
+          <Alert severity={message.type} sx={{ mb: 2 }}>
+            {message.text}
+          </Alert>
+        )}
+
+        {hasAuth0Account ? (
+          <Box>
+            <Alert severity="success" sx={{ mb: 2 }}>
+              Your account is linked with Auth0
+            </Alert>
+            <Typography variant="body2" color="text.secondary" gutterBottom>
+              Email: {user?.services?.auth0?.email || 'N/A'}
+            </Typography>
+            <Typography variant="body2" color="text.secondary" gutterBottom>
+              Name: {user?.services?.auth0?.name || 'N/A'}
+            </Typography>
+            <Button
+              variant="outlined"
+              color="error"
+              onClick={handleUnlinkAccount}
+              disabled={loading}
+              sx={{ mt: 2 }}
+              startIcon={loading ? <CircularProgress size={20} /> : undefined}
+            >
+              {loading ? 'Unlinking...' : 'Unlink Auth0 Account'}
+            </Button>
+          </Box>
+        ) : (
+          <Box>
+            <Alert severity="info" sx={{ mb: 2 }}>
+              Link your account with Auth0 for easier login
+            </Alert>
+            <Button
+              variant="contained"
+              onClick={handleLinkAccount}
+              disabled={loading}
+              startIcon={loading ? <CircularProgress size={20} /> : undefined}
+            >
+              {loading ? 'Linking...' : 'Link Auth0 Account'}
+            </Button>
+          </Box>
+        )}
+      </CardContent>
+    </Card>
+  );
+};

package/bundle/typescript/src/templates/react/kit/mui/auth0/auth0-account-settings.js.tsx

@@ -0,0 +1,123 @@
+import React, { useContext, useState } from 'react';
+import {
+  Box,
+  Card,
+  CardContent,
+  Typography,
+  Button,
+  Alert,
+  CircularProgress,
+} from '@mui/material';
+import { Meteor } from 'meteor/meteor';
+import { AuthContext } from '<%= authContextPath %>';
+
+/**
+ * Auth0 Account Settings Component
+ *
+ * Displays Auth0 account status and allows linking/unlinking
+ * Auth0 account to/from the current Meteor user.
+ */
+export const Auth0AccountSettings: React.FC = () => {
+  const auth = useContext(AuthContext);
+  const [loading, setLoading] = useState(false);
+  const [message, setMessage] = useState<{ type: 'success' | 'error'; text: string } | null>(null);
+
+  if (!auth?.currentUser) {
+    return null;
+  }
+
+  const user = Meteor.user();
+  const hasAuth0Account = Boolean(user?.services?.auth0);
+
+  const handleLinkAccount = async () => {
+    setLoading(true);
+    setMessage(null);
+
+    try {
+      const success = await auth.linkAuth0Account?.();
+      if (success) {
+        setMessage({ type: 'success', text: 'Auth0 account linked successfully!' });
+      }
+    } catch (error) {
+      setMessage({
+        type: 'error',
+        text: error instanceof Error ? error.message : 'Failed to link Auth0 account',
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const handleUnlinkAccount = async () => {
+    setLoading(true);
+    setMessage(null);
+
+    try {
+      const success = await auth.unlinkAuth0Account?.();
+      if (success) {
+        setMessage({ type: 'success', text: 'Auth0 account unlinked successfully!' });
+      }
+    } catch (error) {
+      setMessage({
+        type: 'error',
+        text: error instanceof Error ? error.message : 'Failed to unlink Auth0 account',
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <Card>
+      <CardContent>
+        <Typography variant="h6" gutterBottom>
+          Auth0 Integration
+        </Typography>
+
+        {message && (
+          <Alert severity={message.type} sx={{ mb: 2 }}>
+            {message.text}
+          </Alert>
+        )}
+
+        {hasAuth0Account ? (
+          <Box>
+            <Alert severity="success" sx={{ mb: 2 }}>
+              Your account is linked with Auth0
+            </Alert>
+            <Typography variant="body2" color="text.secondary" gutterBottom>
+              Email: {user?.services?.auth0?.email || 'N/A'}
+            </Typography>
+            <Typography variant="body2" color="text.secondary" gutterBottom>
+              Name: {user?.services?.auth0?.name || 'N/A'}
+            </Typography>
+            <Button
+              variant="outlined"
+              color="error"
+              onClick={handleUnlinkAccount}
+              disabled={loading}
+              sx={{ mt: 2 }}
+              startIcon={loading ? <CircularProgress size={20} /> : undefined}
+            >
+              {loading ? 'Unlinking...' : 'Unlink Auth0 Account'}
+            </Button>
+          </Box>
+        ) : (
+          <Box>
+            <Alert severity="info" sx={{ mb: 2 }}>
+              Link your account with Auth0 for easier login
+            </Alert>
+            <Button
+              variant="contained"
+              onClick={handleLinkAccount}
+              disabled={loading}
+              startIcon={loading ? <CircularProgress size={20} /> : undefined}
+            >
+              {loading ? 'Linking...' : 'Link Auth0 Account'}
+            </Button>
+          </Box>
+        )}
+      </CardContent>
+    </Card>
+  );
+};

package/bundle/typescript/src/templates/react/kit/mui/auth0/auth0-login-button.js.jsx

@@ -0,0 +1,56 @@
+import React, { useContext, useState } from 'react';
+import { Button, CircularProgress } from '@mui/material';
+import { AuthContext } from '<%= authContextPath %>';
+
+/**
+ * Auth0 Login Button Component
+ *
+ * A reusable button component for Auth0 authentication.
+ * Supports both redirect and popup login flows.
+ */
+export const Auth0LoginButton = ({
+  method = 'redirect',
+  onLoginSuccess,
+  onLoginError,
+  children = 'Login with Auth0',
+  ...buttonProps
+}) => {
+  const auth = useContext(AuthContext);
+  const [loading, setLoading] = useState(false);
+
+  const handleLogin = async () => {
+    if (!auth) {
+      console.error('Auth context not available');
+      return;
+    }
+
+    setLoading(true);
+
+    try {
+      if (method === 'popup') {
+        await auth.loginWithAuth0Popup?.();
+        onLoginSuccess?.();
+      } else {
+        // Redirect method - user will leave the page
+        await auth.loginWithAuth0Redirect?.();
+      }
+    } catch (error) {
+      console.error('Auth0 login error:', error);
+      onLoginError?.(error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <Button
+      variant="contained"
+      onClick={handleLogin}
+      disabled={loading || auth?.loading}
+      startIcon={loading ? <CircularProgress size={20} /> : undefined}
+      {...buttonProps}
+    >
+      {loading ? 'Logging in...' : children}
+    </Button>
+  );
+};

package/bundle/typescript/src/templates/react/kit/mui/auth0/auth0-login-button.js.tsx

@@ -0,0 +1,74 @@
+import React, { useContext, useState } from 'react';
+import { Button, ButtonProps, CircularProgress } from '@mui/material';
+import { AuthContext } from '<%= authContextPath %>';
+
+interface Auth0LoginButtonProps extends ButtonProps {
+  /**
+   * Login method to use: 'redirect' or 'popup'
+   * Default is 'redirect'
+   */
+  method?: 'redirect' | 'popup';
+
+  /**
+   * Optional callback after successful login (only for popup method)
+   */
+  onLoginSuccess?: () => void;
+
+  /**
+   * Optional callback on error
+   */
+  onLoginError?: (error: Error) => void;
+}
+
+/**
+ * Auth0 Login Button Component
+ *
+ * A reusable button component for Auth0 authentication.
+ * Supports both redirect and popup login flows.
+ */
+export const Auth0LoginButton: React.FC<Auth0LoginButtonProps> = ({
+  method = 'redirect',
+  onLoginSuccess,
+  onLoginError,
+  children = 'Login with Auth0',
+  ...buttonProps
+}) => {
+  const auth = useContext(AuthContext);
+  const [loading, setLoading] = useState(false);
+
+  const handleLogin = async () => {
+    if (!auth) {
+      console.error('Auth context not available');
+      return;
+    }
+
+    setLoading(true);
+
+    try {
+      if (method === 'popup') {
+        await auth.loginWithAuth0Popup?.();
+        onLoginSuccess?.();
+      } else {
+        // Redirect method - user will leave the page
+        await auth.loginWithAuth0Redirect?.();
+      }
+    } catch (error) {
+      console.error('Auth0 login error:', error);
+      onLoginError?.(error as Error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <Button
+      variant="contained"
+      onClick={handleLogin}
+      disabled={loading || auth?.loading}
+      startIcon={loading ? <CircularProgress size={20} /> : undefined}
+      {...buttonProps}
+    >
+      {loading ? 'Logging in...' : children}
+    </Button>
+  );
+};

package/bundle/typescript/src/tools/scaffold/scaffold.class.d.ts

@@ -108,7 +108,8 @@ export declare class Scaffold {
     copyTemplateDirectory({ srcPath, destPath, context, ignore, keep, framework, config }: ICopyTemplateDir): Promise<void>;
     /**
      * Inject content at the top of a file. If the file
-     * doesn't exist yet, create it.
+     * doesn't exist yet, create it. If the content already exists,
+     * do not inject it again.
      */
     injectAtBeginningOfFile({ filePath, content, opts }: IInjectIntoFile): Promise<void>;
     /**

package/bundle/typescript/src/tools/scaffold/scaffold.class.js

@@ -429,7 +429,8 @@ export class Scaffold {
     }
     /**
      * Inject content at the top of a file. If the file
-     * doesn't exist yet, create it.
+     * doesn't exist yet, create it. If the content already exists,
+     * do not inject it again.
      */
     async injectAtBeginningOfFile({ filePath, content, opts }) {
         if (!filePath) {
@@ -442,11 +443,16 @@ export class Scaffold {
                     data: content
                 });
             }
-            let fileContent = fs.readFileSync(filePath, 'utf8');
-            fileContent = content + "\n" + fileContent;
-            fs.writeFileSync(filePath, fileContent);
-            if (opts?.verbose) {
-                Log.header(`${treeSymbol} updated file ${path.relative(process.cwd(), filePath)}`);
+            else {
+                let fileContent = fs.readFileSync(filePath, 'utf8');
+                // Check if the content already exists in the file
+                if (!fileContent.includes(content)) {
+                    fileContent = content + "\n" + fileContent;
+                    fs.writeFileSync(filePath, fileContent);
+                }
+                if (opts?.verbose) {
+                    Log.header(`${treeSymbol} updated file ${path.relative(process.cwd(), filePath)}`);
+                }
             }
         }
         catch (e) {