diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/stylesheet.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/stylesheet.data.ts
index 26f845a4b1..197fd06b42 100644
--- a/src/Umbraco.Web.UI.Client/src/mocks/data/stylesheet.data.ts
+++ b/src/Umbraco.Web.UI.Client/src/mocks/data/stylesheet.data.ts
@@ -225,9 +225,10 @@ ${rule.selector} {
 	}
 
 	insertStyleSheet(item: CreateTextFileViewModelBaseModel) {
+		const parentPath = item.parentPath ? `${item.parentPath}/` : '';
 		const newItem: StylesheetDBItem = {
 			...item,
-			path: `${item.parentPath}/${item.name}.css`,
+			path: `${parentPath}${item.name}`,
 			isFolder: false,
 			hasChildren: false,
 			type: 'stylesheet',
@@ -238,7 +239,6 @@ ${rule.selector} {
 		return newItem;
 	}
 
-
 	insert(item: StylesheetDBItem) {
 		const exits = this.data.find((i) => i.path === item.path);
 
diff --git a/src/Umbraco.Web.UI.Client/src/mocks/handlers/stylesheet.handlers.ts b/src/Umbraco.Web.UI.Client/src/mocks/handlers/stylesheet.handlers.ts
index 3ae10d1f33..dba7083fa2 100644
--- a/src/Umbraco.Web.UI.Client/src/mocks/handlers/stylesheet.handlers.ts
+++ b/src/Umbraco.Web.UI.Client/src/mocks/handlers/stylesheet.handlers.ts
@@ -39,8 +39,8 @@ const detailHandlers = [
 		const response = umbStylesheetData.getStylesheet(path);
 		return res(ctx.status(200), ctx.json(response));
 	}),
-	rest.post(umbracoPath('/stylesheet'), (req, res, ctx) => {
-		const requestBody = req.json() as CreateTextFileViewModelBaseModel;
+	rest.post(umbracoPath('/stylesheet'), async (req, res, ctx) => {
+		const requestBody = (await req.json()) as CreateTextFileViewModelBaseModel;
 		if (!requestBody) return res(ctx.status(400, 'no body found'));
 		const response = umbStylesheetData.insertStyleSheet(requestBody);
 		return res(ctx.status(200), ctx.json(response));
@@ -53,7 +53,7 @@ const detailHandlers = [
 		return res(ctx.status(200), ctx.json(response));
 	}),
 	rest.put(umbracoPath('/stylesheet'), async (req, res, ctx) => {
-		const requestBody = await req.json() as UpdateStylesheetRequestModel;
+		const requestBody = (await req.json()) as UpdateStylesheetRequestModel;
 		if (!requestBody) return res(ctx.status(400, 'no body found'));
 		umbStylesheetData.updateData(requestBody);
 		return res(ctx.status(200));
@@ -75,7 +75,6 @@ const detailHandlers = [
 	}),
 ];
 
-
 const rulesHandlers = [
 	rest.post(umbracoPath('/stylesheet/rich-text/extract-rules'), async (req, res, ctx) => {
 		const requestBody = req.json() as ExtractRichTextStylesheetRulesRequestModel;