@maka/maka-cli 5.2.10 → 5.3.0

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

@@ -1,71 +0,0 @@
-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

@@ -1,123 +0,0 @@
-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

@@ -1,123 +0,0 @@
-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

@@ -1,56 +0,0 @@
-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 +0,0 @@
-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 +0,0 @@
-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 +0,0 @@
-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/drawers/basic-drawer.js.jsx

@@ -1,121 +0,0 @@
-import { Meteor } from 'meteor/meteor';
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import Box from '@mui/material/Box';
-import Divider from '@mui/material/Divider';
-import Drawer from '@mui/material/Drawer';
-import InboxIcon from '@mui/icons-material/MoveToInbox';
-import List from '@mui/material/List';
-import ListItem from '@mui/material/ListItem';
-import ListItemButton from '@mui/material/ListItemButton';
-import ListItemIcon from '@mui/material/ListItemIcon';
-import ListItemText from '@mui/material/ListItemText';
-import MailIcon from '@mui/icons-material/Mail';
-import Toolbar from '@mui/material/Toolbar';
-
-const drawerWidth = 240;
-
-import { Session } from 'meteor/session';
-import { useTracker } from 'meteor/maka:react-tracker';
-function BasicDrawer(props) {
-
-  const { drawerOpen } = useTracker(() => {
-    let drawerState = false;
-    if (Meteor.isClient) {
-      Meteor.subscribe('drawerState', { drawerOpen: Session.get('drawerOpen') });
-      drawerState = Session.get('drawerOpen');
-    }
-    return { drawerOpen: drawerState };
-  });
-
-  const { window } = props;
-
-  const handleDrawerToggle = () => {
-    Session.set('drawerOpen', !Session.get('drawerOpen'));
-  };
-
-  const drawer = (
-    <div>
-      <Toolbar />
-      <Divider />
-      <List>
-        {['Inbox', 'Starred', 'Send email', 'Drafts'].map((text, index) => (
-          <ListItem key={text} disablePadding>
-            <ListItemButton>
-              <ListItemIcon>
-                {index % 2 === 0 ? <InboxIcon /> : <MailIcon />}
-              </ListItemIcon>
-              <ListItemText primary={text} />
-            </ListItemButton>
-          </ListItem>
-        ))}
-      </List>
-      <Divider />
-      <List>
-        {['All mail', 'Trash', 'Spam'].map((text, index) => (
-          <ListItem key={text} disablePadding>
-            <ListItemButton>
-              <ListItemIcon>
-                {index % 2 === 0 ? <InboxIcon /> : <MailIcon />}
-              </ListItemIcon>
-              <ListItemText primary={text} />
-            </ListItemButton>
-          </ListItem>
-        ))}
-      </List>
-    </div>
-  );
-
-  const container = window !== undefined ? () => window().document.body : undefined;
-
-  return (
-    <Box sx={{ display: 'flex' }}
-      onClick={handleDrawerToggle}
-      onKeyDown={handleDrawerToggle}
-    >
-      <Box
-        component="nav"
-        sx={{ width: { sm: drawerWidth }, flexShrink: { sm: 0 } }}
-        aria-label="mailbox folders"
-      >
-        {/* The implementation can be swapped with js to avoid SEO duplication of links. */}
-        <Drawer
-          container={container}
-          variant="temporary"
-          open={drawerOpen}
-          onClose={handleDrawerToggle}
-          ModalProps={{
-            keepMounted: true, // Better open performance on mobile.
-          }}
-          sx={{
-            display: { xs: 'block', sm: 'none' },
-            '& .MuiDrawer-paper': { boxSizing: 'border-box', width: drawerWidth },
-          }}
-        >
-          {drawer}
-        </Drawer>
-        <Drawer
-          sx={{
-            display: { xs: 'none', sm: 'block' },
-            '& .MuiDrawer-paper': { boxSizing: 'border-box', width: drawerWidth },
-          }}
-          open={drawerOpen}
-        >
-          {drawer}
-        </Drawer>
-      </Box>
-    </Box>
-  );
-}
-
-
-BasicDrawer.propTypes = {
-  /**
-   * Injected by the documentation to work in an iframe.
-   * You won't need it on your project.
-   */
-  // eslint-disable-next-line react/require-default-props
-  window: PropTypes.func,
-};
-
-export { BasicDrawer };