Skip to content
This repository was archived by the owner on Oct 10, 2025. It is now read-only.

Commit e3e488f

Browse files
killerappkillerapp
committed
fix: remove deprecated Grid for Grid2 in MUI
1 parent 9ab3491 commit e3e488f

File tree

7 files changed

+67
-150
lines changed

7 files changed

+67
-150
lines changed

‎examples/context-editor/src/components/ArchitectureSection.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from 'react';
2-
import { Grid, TextField, Accordion, AccordionSummary, AccordionDetails, Typography } from '@mui/material';
2+
import { Grid2, TextField, Accordion, AccordionSummary, AccordionDetails, Typography } from '@mui/material';
33
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
44
import { FormDataType } from './ContextForm';
55

@@ -15,8 +15,8 @@ const ArchitectureSection: React.FC<ArchitectureSectionProps> = ({ formData, han
1515
<Typography>Architecture</Typography>
1616
</AccordionSummary>
1717
<AccordionDetails>
18-
<Grid container spacing={2}>
19-
<Grid item xs={12}>
18+
<Grid2 container spacing={2}>
19+
<Grid2 size={12}>
2020
<TextField
2121
fullWidth
2222
label="Style"
@@ -25,8 +25,8 @@ const ArchitectureSection: React.FC<ArchitectureSectionProps> = ({ formData, han
2525
onChange={handleNestedChange('architecture', 'style')}
2626
helperText="Optional: Architectural style of the module"
2727
/>
28-
</Grid>
29-
<Grid item xs={12}>
28+
</Grid2>
29+
<Grid2 size={12}>
3030
<TextField
3131
fullWidth
3232
label="Components"
@@ -37,8 +37,8 @@ const ArchitectureSection: React.FC<ArchitectureSectionProps> = ({ formData, han
3737
rows={3}
3838
helperText="Optional: One component per line"
3939
/>
40-
</Grid>
41-
<Grid item xs={12}>
40+
</Grid2>
41+
<Grid2 size={12}>
4242
<TextField
4343
fullWidth
4444
label="Data Flow"
@@ -49,8 +49,8 @@ const ArchitectureSection: React.FC<ArchitectureSectionProps> = ({ formData, han
4949
rows={3}
5050
helperText="Optional: One data flow step per line"
5151
/>
52-
</Grid>
53-
</Grid>
52+
</Grid2>
53+
</Grid2>
5454
</AccordionDetails>
5555
</Accordion>
5656
);

‎examples/context-editor/src/components/BusinessRequirementsSection.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from 'react';
2-
import { Grid, TextField, Accordion, AccordionSummary, AccordionDetails, Typography } from '@mui/material';
2+
import { Grid2, TextField, Accordion, AccordionSummary, AccordionDetails, Typography } from '@mui/material';
33
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
44
import { FormDataType } from './ContextForm';
55

@@ -15,8 +15,8 @@ const BusinessRequirementsSection: React.FC<BusinessRequirementsSectionProps> =
1515
<Typography>Business Requirements</Typography>
1616
</AccordionSummary>
1717
<AccordionDetails>
18-
<Grid container spacing={2}>
19-
<Grid item xs={12}>
18+
<Grid2 container spacing={2}>
19+
<Grid2 size={12}>
2020
<TextField
2121
fullWidth
2222
label="Key Features"
@@ -27,8 +27,8 @@ const BusinessRequirementsSection: React.FC<BusinessRequirementsSectionProps> =
2727
rows={3}
2828
helperText="Optional: One feature per line"
2929
/>
30-
</Grid>
31-
<Grid item xs={12}>
30+
</Grid2>
31+
<Grid2 size={12}>
3232
<TextField
3333
fullWidth
3434
label="Target Audience"
@@ -37,8 +37,8 @@ const BusinessRequirementsSection: React.FC<BusinessRequirementsSectionProps> =
3737
onChange={handleNestedChange('businessRequirements', 'targetAudience')}
3838
helperText="Optional: Describe the target audience"
3939
/>
40-
</Grid>
41-
<Grid item xs={12}>
40+
</Grid2>
41+
<Grid2 size={12}>
4242
<TextField
4343
fullWidth
4444
label="Success Metrics"
@@ -49,8 +49,8 @@ const BusinessRequirementsSection: React.FC<BusinessRequirementsSectionProps> =
4949
rows={3}
5050
helperText="Optional: One metric per line"
5151
/>
52-
</Grid>
53-
</Grid>
52+
</Grid2>
53+
</Grid2>
5454
</AccordionDetails>
5555
</Accordion>
5656
);

‎examples/context-editor/src/components/ContextForm.tsx‎

Lines changed: 1 addition & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { useState, useRef, ChangeEvent, useEffect } from 'react';
1+
import React, { useState, useEffect } from 'react';
22
import { Button, Box, Alert, Paper } from '@mui/material';
33
import MetadataSection from './MetadataSection';
44
import ArchitectureSection from './ArchitectureSection';
@@ -92,7 +92,6 @@ const ContextForm: React.FC<ContextFormProps> = ({ onSubmit }) => {
9292
});
9393

9494
const [errors, setErrors] = useState<{ [key: string]: string }>({});
95-
const fileInputRef = useRef<HTMLInputElement>(null);
9695

9796
useEffect(() => {
9897
console.log('Form data updated:', formData);
@@ -137,90 +136,8 @@ const ContextForm: React.FC<ContextFormProps> = ({ onSubmit }) => {
137136
}
138137
};
139138

140-
const handleFileImport = (e: ChangeEvent<HTMLInputElement>) => {
141-
const file = e.target.files?.[0];
142-
if (file) {
143-
const reader = new FileReader();
144-
reader.onload = (e) => {
145-
try {
146-
const content = e.target?.result as string;
147-
console.log('Imported file content:', content);
148-
const parsedData = parseContextMd(content);
149-
console.log('Parsed data:', parsedData);
150-
setFormData(parsedData);
151-
} catch (error) {
152-
console.error('Error parsing imported file:', error);
153-
// You might want to show an error message to the user here
154-
}
155-
};
156-
reader.onerror = (error) => {
157-
console.error('Error reading file:', error);
158-
// You might want to show an error message to the user here
159-
};
160-
reader.readAsText(file);
161-
}
162-
};
163-
164-
const parseContextMd = (content: string): FormDataType => {
165-
const lines = content.split('\n');
166-
const parsedData: FormDataType = JSON.parse(JSON.stringify(formData));
167-
168-
let currentSection: keyof FormDataType | 'metadata' | null = null;
169-
let nestedSection: string | null = null;
170-
171-
lines.forEach((line) => {
172-
if (line.startsWith('# ')) {
173-
currentSection = line.substring(2).trim().toLowerCase() as keyof FormDataType | 'metadata';
174-
nestedSection = null;
175-
} else if (line.startsWith('## ')) {
176-
nestedSection = line.substring(3).trim().toLowerCase();
177-
} else if (line.startsWith('- ')) {
178-
const [key, ...valueParts] = line.substring(2).split(':');
179-
const value = valueParts.join(':').trim();
180-
if (key && value) {
181-
if (currentSection === 'metadata') {
182-
const metadataKey = key.replace(/\s+/g, '') as keyof FormDataType;
183-
if (metadataKey === 'relatedModules' || metadataKey === 'diagrams' || metadataKey === 'technologies') {
184-
(parsedData[metadataKey] as string[]) = value.split(',').map((s) => s.trim());
185-
} else if (metadataKey in parsedData) {
186-
(parsedData[metadataKey] as string) = value;
187-
}
188-
} else if (currentSection && currentSection in parsedData && typeof parsedData[currentSection] === 'object') {
189-
const sectionData = parsedData[currentSection] as Record<string, unknown>;
190-
if (nestedSection) {
191-
if (!(nestedSection in sectionData)) {
192-
sectionData[nestedSection] = {};
193-
}
194-
(sectionData[nestedSection] as Record<string, string>)[key] = value;
195-
} else {
196-
(sectionData as Record<string, string>)[key] = value;
197-
}
198-
}
199-
}
200-
}
201-
});
202-
203-
return parsedData;
204-
};
205-
206139
return (
207140
<form onSubmit={handleSubmit}>
208-
<Box sx={{ mb: 2 }}>
209-
<input
210-
type="file"
211-
accept=".md"
212-
ref={fileInputRef}
213-
style={{ display: 'none' }}
214-
onChange={handleFileImport}
215-
/>
216-
<Button
217-
variant="outlined"
218-
onClick={() => fileInputRef.current?.click()}
219-
>
220-
Import .context.md
221-
</Button>
222-
</Box>
223-
224141
<Paper elevation={3} sx={{ p: 3, mb: 3, bgcolor: 'background.default' }}>
225142
<MetadataSection
226143
formData={formData}

‎examples/context-editor/src/components/DeploymentSection.tsx‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from 'react';
2-
import { Grid, TextField, Accordion, AccordionSummary, AccordionDetails, Typography } from '@mui/material';
2+
import { Grid2, TextField, Accordion, AccordionSummary, AccordionDetails, Typography } from '@mui/material';
33
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
44
import { FormDataType } from './ContextForm';
55

@@ -15,8 +15,8 @@ const DeploymentSection: React.FC<DeploymentSectionProps> = ({ formData, handleN
1515
<Typography>Deployment</Typography>
1616
</AccordionSummary>
1717
<AccordionDetails>
18-
<Grid container spacing={2}>
19-
<Grid item xs={12} sm={6}>
18+
<Grid2 container spacing={2}>
19+
<Grid2 size={{ xs: 12, sm: 6 }}>
2020
<TextField
2121
fullWidth
2222
label="Platform"
@@ -25,8 +25,8 @@ const DeploymentSection: React.FC<DeploymentSectionProps> = ({ formData, handleN
2525
onChange={handleNestedChange('deployment', 'platform')}
2626
helperText="Optional: Deployment platform"
2727
/>
28-
</Grid>
29-
<Grid item xs={12} sm={6}>
28+
</Grid2>
29+
<Grid2 size={{ xs: 12, sm: 6 }}>
3030
<TextField
3131
fullWidth
3232
label="CI/CD Pipeline"
@@ -35,8 +35,8 @@ const DeploymentSection: React.FC<DeploymentSectionProps> = ({ formData, handleN
3535
onChange={handleNestedChange('deployment', 'cicdPipeline')}
3636
helperText="Optional: CI/CD pipeline details"
3737
/>
38-
</Grid>
39-
<Grid item xs={12} sm={6}>
38+
</Grid2>
39+
<Grid2 size={{ xs: 12, sm: 6 }}>
4040
<TextField
4141
fullWidth
4242
label="Staging Environment"
@@ -45,8 +45,8 @@ const DeploymentSection: React.FC<DeploymentSectionProps> = ({ formData, handleN
4545
onChange={handleNestedChange('deployment', 'stagingEnvironment')}
4646
helperText="Optional: Staging environment details"
4747
/>
48-
</Grid>
49-
<Grid item xs={12} sm={6}>
48+
</Grid2>
49+
<Grid2 size={{ xs: 12, sm: 6 }}>
5050
<TextField
5151
fullWidth
5252
label="Production Environment"
@@ -55,8 +55,8 @@ const DeploymentSection: React.FC<DeploymentSectionProps> = ({ formData, handleN
5555
onChange={handleNestedChange('deployment', 'productionEnvironment')}
5656
helperText="Optional: Production environment details"
5757
/>
58-
</Grid>
59-
</Grid>
58+
</Grid2>
59+
</Grid2>
6060
</AccordionDetails>
6161
</Accordion>
6262
);

‎examples/context-editor/src/components/DevelopmentSection.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from 'react';
2-
import { Grid, TextField, Accordion, AccordionSummary, AccordionDetails, Typography } from '@mui/material';
2+
import { Grid2, TextField, Accordion, AccordionSummary, AccordionDetails, Typography } from '@mui/material';
33
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
44
import { FormDataType } from './ContextForm';
55

@@ -15,8 +15,8 @@ const DevelopmentSection: React.FC<DevelopmentSectionProps> = ({ formData, handl
1515
<Typography>Development</Typography>
1616
</AccordionSummary>
1717
<AccordionDetails>
18-
<Grid container spacing={2}>
19-
<Grid item xs={12}>
18+
<Grid2 container spacing={2}>
19+
<Grid2 size={12}>
2020
<TextField
2121
fullWidth
2222
label="Setup Steps"
@@ -27,8 +27,8 @@ const DevelopmentSection: React.FC<DevelopmentSectionProps> = ({ formData, handl
2727
rows={3}
2828
helperText="Optional: One setup step per line"
2929
/>
30-
</Grid>
31-
<Grid item xs={12} sm={6}>
30+
</Grid2>
31+
<Grid2 size={{ xs: 12, sm: 6 }}>
3232
<TextField
3333
fullWidth
3434
label="Build Command"
@@ -37,8 +37,8 @@ const DevelopmentSection: React.FC<DevelopmentSectionProps> = ({ formData, handl
3737
onChange={handleNestedChange('development', 'buildCommand')}
3838
helperText="Optional: Command to build the project"
3939
/>
40-
</Grid>
41-
<Grid item xs={12} sm={6}>
40+
</Grid2>
41+
<Grid2 size={{ xs: 12, sm: 6 }}>
4242
<TextField
4343
fullWidth
4444
label="Test Command"
@@ -47,8 +47,8 @@ const DevelopmentSection: React.FC<DevelopmentSectionProps> = ({ formData, handl
4747
onChange={handleNestedChange('development', 'testCommand')}
4848
helperText="Optional: Command to run tests"
4949
/>
50-
</Grid>
51-
</Grid>
50+
</Grid2>
51+
</Grid2>
5252
</AccordionDetails>
5353
</Accordion>
5454
);

0 commit comments

Comments
 (0)