refactor logic for existing file check based on paths

src/components/SidePane.jsx

@@ -1,5 +1,6 @@
 import { h, Component } from 'preact';
 import { FileIcon } from './FileIcon';
+import { getParentPath, getFileFromPath } from '../fileUtils';
 
 const ENTER_KEY = 13;
 const ESCAPE_KEY = 27;
@@ -136,13 +137,15 @@ export class SidePane extends Component {
 	 */
 	warnForExistingFileName(newFileName) {
 		// We also check for fileBeingRenamed !== file because when a file being renamed is
-		// asked to be set same name, then that should not match and warn here.
-		if (
-			this.props.files.some(
-				file =>
-					file.name === newFileName && this.state.fileBeingRenamed !== file
-			)
-		) {
+		// asked to be set as same name, then that should not match and warn here.
+		let newPath = this.state.fileBeingRenamed
+			? `${getParentPath(this.state.fileBeingRenamed.path)}/${newFileName}`
+			: newFileName;
+		// remove first slash
+		newPath = newPath.replace(/^\//, '');
+		const match = getFileFromPath(this.props.files, newPath);
+
+		if (match.file && this.state.fileBeingRenamed !== match.file) {
 			alert(`A file with name ${newFileName} already exists.`);
 			return false;
 		}

src/fileUtils.js

@@ -95,3 +95,15 @@ export function doesFileExistInFolder(folder, fileName) {
 	const details = getChildFileFromName(folder.children, fileName);
 	return !!details.file;
 }
+
+/**
+ * Returns parent path of passed path
+ * @param {string} path Path of file to find parent of
+ */
+export function getParentPath(path) {
+	const pathPieces = path.split('/');
+	if (pathPieces.length > 1) {
+		return pathPieces.slice(0, -1).join('/');
+	}
+	return '';
+}

src/tests/fileUtils.test.js

@@ -3,7 +3,8 @@ import { shallow, deep } from 'preact-render-spy';
 import {
 	assignFilePaths,
 	getFileFromPath,
-	removeFileAtPath
+	removeFileAtPath,
+	getParentPath
 } from '../fileUtils';
 
 function getNestedFiles() {
@@ -81,3 +82,15 @@ describe('removeFileAtPath', () => {
 		expect(files[2].name).toBe('script.js');
 	});
 });
+
+describe('getParentPath', () => {
+	test('should return correct parent path for root file', () => {
+		expect(getParentPath('style.css')).toBe('');
+	});
+
+	test('should return correct parent path for nested file', () => {
+		expect(getParentPath('styles/style.css')).toBe('styles');
+		expect(getParentPath('js/plugins/main.js')).toBe('js/plugins');
+		expect(getParentPath('js/plugins/readme')).toBe('js/plugins');
+	});
+});