vzcode 0.5.0 → 0.6.0

package/src/client/Sidebar/FileOrDirectory.jsx

@@ -1,33 +0,0 @@
-import { File } from './File';
-import { Directory } from './Directory';
-
-export const FileOrDirectory = ({
-  entity,
-  handleRenameFileClick,
-  handleDeleteFileClick,
-  handleFileClick,
-  openDirectories,
-  toggleDirectory,
-}) => {
-  const { name, path, fileId, file, children } = entity;
-  return file ? (
-    <File
-      fileId={fileId}
-      name={name}
-      handleRenameFileClick={handleRenameFileClick}
-      handleDeleteFileClick={handleDeleteFileClick}
-      handleFileClick={handleFileClick}
-    />
-  ) : (
-    <Directory
-      name={name}
-      path={path}
-      children={children}
-      handleRenameFileClick={handleRenameFileClick}
-      handleDeleteFileClick={handleDeleteFileClick}
-      handleFileClick={handleFileClick}
-      openDirectories={openDirectories}
-      toggleDirectory={toggleDirectory}
-    />
-  );
-};

package/src/client/Sidebar/index.jsx

@@ -1,64 +0,0 @@
-import { useMemo } from 'react';
-import { getFileTree } from '../getFileTree';
-import { sortFileTree } from '../sortFileTree';
-import { disableSettings } from '../featureFlags';
-import { FileOrDirectory } from './FileOrDirectory';
-import { useOpenDirectories } from './useOpenDirectories';
-
-import './styles.css';
-
-export const Sidebar = ({
-  createFile,
-  data,
-  handleRenameFileClick,
-  handleDeleteFileClick,
-  handleFileClick,
-  setSettings,
-  settings,
-}) => {
-  const fileTree = useMemo(
-    () => (data ? sortFileTree(getFileTree(data)) : null),
-    [data]
-  );
-
-  const { openDirectories, toggleDirectory } = useOpenDirectories();
-
-  return (
-    <div className="vz-sidebar">
-      <div className="files">
-        <div className="full-box">
-          <div>
-            <a className="link-name" href="#">
-              Files
-            </a>
-          </div>
-          <div>
-            <i
-              className="bx bxs-file-plus new-btn"
-              style={{ color: '#dbdde1' }}
-              onClick={createFile}
-            ></i>
-          </div>
-        </div>
-      </div>
-      {fileTree
-        ? fileTree.children.map((entity) => (
-            <FileOrDirectory
-              entity={entity}
-              key={entity.fileId || entity.path}
-              handleRenameFileClick={handleRenameFileClick}
-              handleDeleteFileClick={handleDeleteFileClick}
-              handleFileClick={handleFileClick}
-              openDirectories={openDirectories}
-              toggleDirectory={toggleDirectory}
-            />
-          ))
-        : null}
-      {disableSettings ? null : (
-        <div className="settings" onClick={() => setSettings(!settings)}>
-          Settings
-        </div>
-      )}
-    </div>
-  );
-};

package/src/client/Sidebar/styles.css

@@ -1,88 +0,0 @@
-.vz-sidebar {
-  /* TODO remove position: fixed, overhaul CSS to use Flexbox for entire app */
-
-  position: fixed;
-  top: 0;
-  left: 0;
-  height: 100%;
-  width: 200px;
-  background: rgb(54, 65, 89);
-}
-
-.vz-sidebar .full-box {
-  padding: 7px;
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: space-between;
-}
-
-.vz-sidebar .file-or-directory {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: space-between;
-  cursor: pointer;
-  margin: 0 10px;
-  color: rgb(219, 221, 225);
-  border-radius: 5px;
-}
-
-.vz-sidebar .link-name {
-  margin-top: 30px;
-  margin-left: 10px;
-  color: rgb(154, 160, 172);
-  font-size: 12px;
-  text-decoration: none;
-}
-
-.vz-sidebar .new-btn {
-  justify-content: right;
-  margin-right: 10px;
-  cursor: pointer;
-}
-
-.vz-sidebar .utils {
-  display: flex;
-}
-
-.vz-sidebar .utilities {
-  margin-right: 3px;
-}
-
-.vz-sidebar .settings {
-  position: absolute;
-  bottom: 0;
-  height: 30px;
-  width: 180px;
-  z-index: 100;
-  color: rgb(219, 221, 225);
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 14px 0;
-  margin: 10px;
-  border-radius: 5px;
-}
-
-.vz-sidebar .file-or-directory:hover,
-.vz-sidebar .settings:hover {
-  background-color: rgb(74, 84, 105);
-}
-
-.vz-sidebar .name {
-  display: flex;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  overflow: hidden;
-}
-
-/* Responsible for indenting directories */
-.vz-sidebar .indentation {
-  margin-left: 20px;
-}
-
-.vz-sidebar .arrow-wrapper {
-  margin-right: 4px;
-}

package/src/client/style.css

@@ -1,120 +0,0 @@
-/* Inspired by: https://www.codinglabweb.com/2021/06/dropdown-sidebar-menu-html-css.html */
-/* Google Fonts Import Link */
-@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');
-@import url('https://unpkg.com/boxicons@2.0.7/css/boxicons.min.css');
-@import url('https://unpkg.com/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css');
-
-* {
-  margin: 0;
-  padding: 0;
-  box-sizing: border-box;
-}
-
-/* width */
-::-webkit-scrollbar {
-  width: 10px;
-  height: 20px;
-}
-
-/* Track */
-::-webkit-scrollbar-track {
-  background: rgb(41, 44, 52);
-}
-
-/* Handle */
-::-webkit-scrollbar-thumb {
-  background: rgb(37, 37, 38);
-}
-
-/* Handle on hover */
-::-webkit-scrollbar-thumb:hover {
-  background: #555;
-}
-
-:root {
-  --main-font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas,
-    Liberation Mono, monospace;
-}
-
-body {
-  background: rgb(41, 44, 52);
-  font-family: 'Poppins', sans-serif;
-  overflow-x: hidden;
-}
-
-.tab {
-  width: max-content;
-  height: 30px;
-  background: rgb(45, 45, 45);
-  text-align: center;
-  color: #fff;
-  font-family: var(--main-font-family);
-  justify-content: center;
-  align-items: center;
-  display: flex;
-  padding-left: 10px;
-  padding-right: 10px;
-  border-top-left-radius: 10px;
-  border-top-right-radius: 10px;
-  margin-top: 5px;
-  margin-left: 2px;
-  margin-right: 2px;
-  cursor: pointer;
-}
-
-.tab.active {
-  background-color: rgb(41, 44, 52);
-}
-
-.tab-close {
-  display: flex;
-  cursor: pointer;
-  margin-left: 5px;
-  justify-content: center;
-  align-items: center;
-}
-
-.tab-close:hover {
-  border-radius: 30%;
-  background-color: rgb(37, 37, 38);
-}
-
-.editor {
-  position: relative;
-  margin-left: 200px;
-  width: 100%;
-  height: 100%;
-  top: 30px;
-  bottom: 0;
-  background-color: rgb(41, 44, 52);
-  color: #fff;
-  font-family: var(--main-font-family);
-}
-
-.tab-list {
-  position: fixed;
-  display: flex;
-  flex-direction: row;
-  top: 0;
-  left: 200px;
-  height: 35px;
-  width: 100%;
-  background: rgb(37, 37, 38);
-  z-index: 100;
-  transition: all 0.5s ease;
-}
-
-.bottom-bar {
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  height: 20px;
-  width: 100%;
-  background: rgb(45, 45, 45);
-  z-index: 100;
-  transition: all 0.5s ease;
-}
-
-.themes {
-  color: rgb(37, 37, 38);
-}