Proyectos de Subversion LeadersLinked - SPA

Rev

Ir a la última revisión | | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
3741 stevensc 1 
import React from 'react';
2 
 
3 
import { useAlertModal, useModal } from '@shared/hooks';
4 
import { useCategories, useQuestions } from '@my-coach/hooks';
5 
import { parseHelperToSelect } from '@shared/utils';
6 
 
7 
import {
8 
  FilterSelect,
9 
  FiltersRow,
10 
  PageHeader,
11 
  SearchBar,
12 
  Spinner,
13 
  Button,
14 
  Grid
15 
} from '@shared/components';
16 
import { QuestionCard, QuestionForm } from '@my-coach/components';
17 
 
18 
export function MyCoachPage() {
19 
  const {
20 
    questions,
21 
    loading,
22 
    hasMore,
23 
    search,
24 
    category,
25 
    loadMore,
26 
    searchQuestion,
27 
    searchCategory,
28 
    clearFilters,
29 
    editQuestion,
30 
    deleteQuestion,
31 
    addQuestion
32 
  } = useQuestions();
33 
 
34 
  const { categories, loading: categoriesLoading } = useCategories();
35 
 
36 
  const { showModal, closeModal } = useModal();
37 
  const { showAlert, closeAlert } = useAlertModal();
38 
 
39 
  const handleAddQuestion = () => {
40 
    showModal(
41 
      'Agregar pregunta',
42 
      <QuestionForm
43 
        categories={categories}
44 
        onSubmit={(data) => {
45 
          addQuestion(data);
46 
          closeModal();
47 
        }}
48 
      />
49 
    );
50 
  };
51 
 
52 
  const handleEditQuestion = async (question) => {
53 
    showModal(
54 
      'Editar pregunta',
55 
      <QuestionForm
56 
        question={question}
57 
        categories={categories}
58 
        onSubmit={(data) => {
59 
          editQuestion(question.uuid, data);
60 
          closeModal();
61 
        }}
62 
      />
63 
    );
64 
  };
65 
 
66 
  const handleDeleteQuestion = (question) => {
67 
    showAlert({
68 
      title: 'Eliminar pregunta',
69 
      message: '¿Estás seguro de querer eliminar esta pregunta?',
70 
      onConfirm: () => {
71 
        deleteQuestion(question.link_delete);
72 
        closeAlert();
73 
      }
74 
    });
75 
  };
76 
 
77 
  if (categoriesLoading || loading || !categories || !questions) {
78 
    return <Spinner />;
79 
  }
80 
 
81 
  return (
82 
    <>
83 
      <PageHeader title='Mi Coach' labelAdd='Agregar pregunta' onAdd={handleAddQuestion} />
84 
 
85 
      <FiltersRow>
86 
        <FilterSelect
87 
          options={parseHelperToSelect(categories)}
88 
          value={category}
89 
          onChange={searchCategory}
90 
          placeholder='Filtrar por categoría'
91 
        />
92 
        <SearchBar onChange={searchQuestion} value={search} />
93 
        <Button onClick={clearFilters}>Limpiar filtros</Button>
94 
      </FiltersRow>
95 
 
96 
      <Grid
97 
        items={questions}
98 
        emptyMessage='No hay preguntas para mostrar'
99 
        keyExtractor={(question) => question.uuid}
100 
        renderItem={(question) => (
101 
          <QuestionCard
102 
            question={question}
103 
            onEdit={handleEditQuestion}
104 
            onDelete={handleDeleteQuestion}
105 
          />
106 
        )}
107 
        renderFooter={() => (hasMore ? <Button onClick={loadMore}>Cargar más</Button> : null)}
108 
      />
109 
    </>
110 
  );
111 
}