refactor(app): update deps, decomposition, formatting

src/pages/figure.vue

@@ -1,20 +1,4 @@
 <script setup lang="ts">
-const axes = ['x', 'y', 'z'];
-const projections = [
-  { projection: Projections.NONE, title: 'Без проекции' },
-  { projection: Projections.ISOMETRIC, title: 'Изометрическая' },
-  { projection: Projections.DIMETRIC, title: 'Диметрическая' },
-  { projection: Projections.TRIMETRIC, title: 'Триметрическая' },
-  {
-    projection: Projections.ONE_POINT_PERSPECTIVE,
-    title: 'Одноточечная перспектива',
-  },
-  {
-    projection: Projections.TWO_POINT_PERSPECTIVE,
-    title: 'Двухточечная перспектива',
-  },
-];
-
 const activeProjection = ref<number>(0);
 
 const transformations = useTransformations();
@@ -23,7 +7,7 @@ onMounted(() => (activeProjection.value = transformations.projection.value));
 
 const setActiveProjection = (index: number) => {
   activeProjection.value = index;
-  transformations.setProjection(projections[index].projection);
+  transformations.setProjection(projectionsMenu[index].projection);
 };
 </script>
 
@@ -69,7 +53,7 @@ const setActiveProjection = (index: number) => {
     <Accordion title="Проекции">
       <GridContainer>
         <GridElement
-          v-for="(projection, i) in projections"
+          v-for="(projection, i) in projectionsMenu"
           :key="projection.title"
           :is-active="activeProjection === i"
           :title="projection.title"

src/pages/index.vue

@@ -1,22 +1,14 @@
 <script setup lang="ts">
-const allFigures = [
-  { figure: Figures.CUBE, title: 'Куб' },
-  { figure: Figures.OCTAHEDRON, title: 'Октаэдр' },
-  { figure: Figures.TRIHEDRAL_PYRAMID, title: 'Трехгранная пирамида' },
-  { figure: Figures.SQUARE_PYRAMID, title: 'Четырехгранная пирамида' },
-  { figure: Figures.PENTAGONAL_PYRAMID, title: 'Пятигранная пирамиида' },
-];
-
 const activeFigure = ref<number>(0);
 
 const figure = useFigure();
 
 onMounted(() => (activeFigure.value = figure.currentFigure.value));
 
-const selectFigure = (index: number) => {
+const selectFigure = async (index: number) => {
   activeFigure.value = index;
-  figure.setFigure(allFigures[index].figure);
-  navigateTo('/figure');
+  figure.setFigure(figuresMenu[index].figure);
+  await navigateTo('/figure');
 };
 </script>
 
@@ -24,7 +16,7 @@ const selectFigure = (index: number) => {
   <h1>Выберете фигуру</h1>
   <GridContainer>
     <GridElement
-      v-for="(figure, i) in allFigures"
+      v-for="(figure, i) in figuresMenu"
       :key="figure.title"
       :title="figure.title"
       :is-active="activeFigure === i"