@Composable
@Deprecated("Example with bug")
fun ListWithBug(myList: List<String>) {
    var items = 0

    Row(horizontalArrangement = Arrangement.SpaceBetween) {
        Column {
            for (item in myList) {
                Text("Item: $item")
                items++ // 🛑【NG】避ける！カラム再構成の副作用
　　　　　　　　　👆remember または rememberAsSaveableという関数を用いて、
　　　　　　　　　　　　MutablState<T>という型の変数を設ければ、@Composable関数の中で状態管理をしても良い。
            }
        }
        Text("Count: $items")
    }
}

@Composable
fun EditTaskScreen(
    // TODO:ViewModelは基本外から注入、Nav関連もMyApp（NavHostの定義場所）で制御するようにする
    viewModel: EditTaskViewModel,
    back: () -> Unit,
) {
    //  private　な　Composable　は部品として使いまわせるようにしとく
　　//       　→　処理（✅ callback ）は public な Composable から渡すようにする
    //         →　ViewModelは、MyAppでさらに外部から渡すようにする（一元管理できるから？）
    //         .
    // 【collectAsState】 : StateFlow　や　Flow　からデータを収集し、そのデータを　ComposeUI　の　State　オブジェクトに変換。
    //       これにより、Compose が状態の変更を検知して UI を再描画できるようになる
    val uiState by viewModel.uiState.collectAsState()

    //  uiState を渡して、変化があれば再コンポーズさせる？
    EditTaskScreen(
        uiState = uiState,
        back = back,
        loadData = { viewModel.loadData() },
        changeIdle = { viewModel.changeIdle() },
        updateTask = { title, description ->
            viewModel.updateTask(title, description)
        },
        showDeleteDialog = {
            viewModel.showDeleteDialog()
        },
        deleteTask = {
            viewModel.deleteTask()
        }
    )
}

@Composable
fun HelloScreen() {
    var name by rememberSaveable { mutableStateOf("") }

    HelloContent(name = name, onNameChange = { name = it })
}

@Composable
fun HelloContent(name: String, onNameChange: (String) -> Unit) {
    Column(modifier = Modifier.padding(16.dp)) {
        Text(
            text = "Hello, $name",
            modifier = Modifier.padding(bottom = 8.dp),
            style = MaterialTheme.typography.h5
        )
        OutlinedTextField(
            value = name,
            onValueChange = onNameChange,
            label = { Text("Name") }
        )
    }
}

private val _uiState = MutableStateFlow<UiState>(UiState.Initial)
// TODO: asStateFlow: MutableStateFlow　→　StateFlowに変換
val uiState: StateFlow<UiState> = _uiState.asStateFlow()

var inputMessage by mutableStateOf("")
     private set

val mutableState = remember { mutableStateOf(default) }
// or
var value by remember { mutableStateOf(default) }
// or
val (value, setValue) = remember { mutableStateOf(default) }

@Composable
fun HelloScreen() {
    var name by rememberSaveable { mutableStateOf("") }

    HelloContent(name = name, onNameChange = { name = it })
}

@Composable
fun HelloContent(name: String, onNameChange: (String) -> Unit) {
    Column(modifier = Modifier.padding(16.dp)) {
        Text(
            text = "Hello, $name",
            modifier = Modifier.padding(bottom = 8.dp),
            style = MaterialTheme.typography.h5
        )
        OutlinedTextField(
            value = name,
            onValueChange = onNameChange,
            label = { Text("Name") }
        )
    }
}