@maka/maka-cli 5.123.1 → 5.125.0

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

@@ -1,56 +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>
-  );
-};
+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

@@ -1,74 +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>
-  );
-};
+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/templates/react/kit/mui/frame/app-bars/basic-app-bar.js.jsx

@@ -1,43 +1,43 @@
-import React from 'react';
-import AppBar from '@mui/material/AppBar';
-import Box from '@mui/material/Box';
-import Toolbar from '@mui/material/Toolbar';
-import Typography from '@mui/material/Typography';
-import Button from '@mui/material/Button';
-import IconButton from '@mui/material/IconButton';
-import MenuIcon from '@mui/icons-material/Menu';
-import { useNavigate } from 'react-router-dom';
-
-import { Session } from 'meteor/session';
-
-function BasicAppBar() {
-  const handleDrawerToggle = () => {
-    Session.set('drawerOpen', !Session.get('drawerOpen'));
-  };
-  const navigate = useNavigate();
-
-  return (
-    <Box id="app-bar" sx={{ flexGrow: 1 }}>
-      <AppBar position="static">
-        <Toolbar>
-          <IconButton
-            size="large"
-            edge="start"
-            color="inherit"
-            aria-label="menu"
-            sx={{ mr: 2 }}
-            onClick={handleDrawerToggle}
-          >
-            <MenuIcon />
-          </IconButton>
-          <Typography onClick={() => navigate('/')} variant="h6" component="div" sx={{ flexGrow: 1, cursor: 'pointer' }}>
-            <%= name %>
-          </Typography>
-          <Button onClick={() => navigate('/login')} color="inherit">Login</Button>
-        </Toolbar>
-      </AppBar>
-    </Box>
-  );
-}
-
-export { BasicAppBar };
+import React from 'react';
+import AppBar from '@mui/material/AppBar';
+import Box from '@mui/material/Box';
+import Toolbar from '@mui/material/Toolbar';
+import Typography from '@mui/material/Typography';
+import Button from '@mui/material/Button';
+import IconButton from '@mui/material/IconButton';
+import MenuIcon from '@mui/icons-material/Menu';
+import { useNavigate } from 'react-router-dom';
+
+import { Session } from 'meteor/session';
+
+function BasicAppBar() {
+  const handleDrawerToggle = () => {
+    Session.set('drawerOpen', !Session.get('drawerOpen'));
+  };
+  const navigate = useNavigate();
+
+  return (
+    <Box id="app-bar" sx={{ flexGrow: 1 }}>
+      <AppBar position="static">
+        <Toolbar>
+          <IconButton
+            size="large"
+            edge="start"
+            color="inherit"
+            aria-label="menu"
+            sx={{ mr: 2 }}
+            onClick={handleDrawerToggle}
+          >
+            <MenuIcon />
+          </IconButton>
+          <Typography onClick={() => navigate('/')} variant="h6" component="div" sx={{ flexGrow: 1, cursor: 'pointer' }}>
+            <%= name %>
+          </Typography>
+          <Button onClick={() => navigate('/login')} color="inherit">Login</Button>
+        </Toolbar>
+      </AppBar>
+    </Box>
+  );
+}
+
+export { BasicAppBar };

package/bundle/typescript/src/templates/react/kit/mui/frame/app-bars/basic-app-bar.js.tsx

@@ -1,43 +1,43 @@
-import React from 'react';
-import AppBar from '@mui/material/AppBar';
-import Box from '@mui/material/Box';
-import Toolbar from '@mui/material/Toolbar';
-import Typography from '@mui/material/Typography';
-import Button from '@mui/material/Button';
-import IconButton from '@mui/material/IconButton';
-import MenuIcon from '@mui/icons-material/Menu';
-import { useNavigate } from 'react-router-dom';
-
-import { Session } from 'meteor/session';
-
-function BasicAppBar() {
-  const handleDrawerToggle = () => {
-    Session.set('drawerOpen', !Session.get('drawerOpen'));
-  };
-  const navigate = useNavigate();
-
-  return (
-    <Box id="app-bar" sx={{ flexGrow: 1 }}>
-      <AppBar position="static">
-        <Toolbar>
-          <IconButton
-            size="large"
-            edge="start"
-            color="inherit"
-            aria-label="menu"
-            sx={{ mr: 2 }}
-            onClick={handleDrawerToggle}
-          >
-            <MenuIcon />
-          </IconButton>
-          <Typography onClick={() => navigate('/')} variant="h6" component="div" sx={{ flexGrow: 1, cursor: 'pointer' }}>
-            <%= name %>
-          </Typography>
-          <Button onClick={() => navigate('/login')} color="inherit">Login</Button>
-        </Toolbar>
-      </AppBar>
-    </Box>
-  );
-}
-
-export { BasicAppBar };
+import React from 'react';
+import AppBar from '@mui/material/AppBar';
+import Box from '@mui/material/Box';
+import Toolbar from '@mui/material/Toolbar';
+import Typography from '@mui/material/Typography';
+import Button from '@mui/material/Button';
+import IconButton from '@mui/material/IconButton';
+import MenuIcon from '@mui/icons-material/Menu';
+import { useNavigate } from 'react-router-dom';
+
+import { Session } from 'meteor/session';
+
+function BasicAppBar() {
+  const handleDrawerToggle = () => {
+    Session.set('drawerOpen', !Session.get('drawerOpen'));
+  };
+  const navigate = useNavigate();
+
+  return (
+    <Box id="app-bar" sx={{ flexGrow: 1 }}>
+      <AppBar position="static">
+        <Toolbar>
+          <IconButton
+            size="large"
+            edge="start"
+            color="inherit"
+            aria-label="menu"
+            sx={{ mr: 2 }}
+            onClick={handleDrawerToggle}
+          >
+            <MenuIcon />
+          </IconButton>
+          <Typography onClick={() => navigate('/')} variant="h6" component="div" sx={{ flexGrow: 1, cursor: 'pointer' }}>
+            <%= name %>
+          </Typography>
+          <Button onClick={() => navigate('/login')} color="inherit">Login</Button>
+        </Toolbar>
+      </AppBar>
+    </Box>
+  );
+}
+
+export { BasicAppBar };