react Architecture Docs
Home / File/ TodoDetail.tsx — react Source File

TodoDetail.tsx — react Source File

Architecture documentation for TodoDetail.tsx, a tsx file in the react codebase. 3 imports, 1 dependents.

File tsx BabelCompiler Optimization 3 imports 1 dependents 1 functions

Entity Profile

Dependency Diagram

graph LR
  9d193cb4_26df_d78d_77c8_1c784c234257["TodoDetail.tsx"]
  a2e3768b_191e_9986_afcb_87f97e20160d["actions.ts"]
  9d193cb4_26df_d78d_77c8_1c784c234257 --> a2e3768b_191e_9986_afcb_87f97e20160d
  34b8c762_7987_3584_58bb_9252fbc08ae7["getTodo"]
  9d193cb4_26df_d78d_77c8_1c784c234257 --> 34b8c762_7987_3584_58bb_9252fbc08ae7
  ad6c363f_dad2_5688_7e0f_a799d578b6d3["updateTodo"]
  9d193cb4_26df_d78d_77c8_1c784c234257 --> ad6c363f_dad2_5688_7e0f_a799d578b6d3
  c3489d06_1452_f7f8_d28f_240d296f1926["Todos.tsx"]
  c3489d06_1452_f7f8_d28f_240d296f1926 --> 9d193cb4_26df_d78d_77c8_1c784c234257
  style 9d193cb4_26df_d78d_77c8_1c784c234257 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import {getTodo, updateTodo} from './actions';

export async function TodoDetail({id}: {id: number}) {
  let todo = await getTodo(id);
  if (!todo) {
    return <p>Todo not found</p>;
  }

  return (
    <form className="todo" action={updateTodo.bind(null, todo.id)}>
      <label>
        Title: <input name="title" defaultValue={todo.title} />
      </label>
      <label>
        Description:{' '}
        <textarea name="description" defaultValue={todo.description} />
      </label>
      <label>
        Due date:{' '}
        <input type="date" name="dueDate" defaultValue={todo.dueDate} />
      </label>
      <button type="submit">Update todo</button>
    </form>
  );
}

Domain

Subdomains

Functions

Dependencies

Imported By

Source

Frequently Asked Questions

What does TodoDetail.tsx do?
TodoDetail.tsx is a source file in the react codebase, written in tsx. It belongs to the BabelCompiler domain, Optimization subdomain.
What functions are defined in TodoDetail.tsx?
TodoDetail.tsx defines 1 function(s): TodoDetail.
What does TodoDetail.tsx depend on?
TodoDetail.tsx imports 3 module(s): actions.ts, getTodo, updateTodo.
What files import TodoDetail.tsx?
TodoDetail.tsx is imported by 1 file(s): Todos.tsx.
Where is TodoDetail.tsx in the architecture?
TodoDetail.tsx is located at fixtures/flight-parcel/src/TodoDetail.tsx (domain: BabelCompiler, subdomain: Optimization, directory: fixtures/flight-parcel/src).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free