From 3669d10ad4d9649a64643c42dd8842d7520a1927 Mon Sep 17 00:00:00 2001
From: "Jarlem Red J. de Peralta" <lmoa.jhdp@gmail.com>
Date: Tue, 20 Dec 2022 18:26:05 +0800
Subject: [PATCH] feat(component): allow various clearing operations

The clearing operations are:
- `clearOneDigit`
- `clearAllScreens`
- `clearEntryScreen`

`entryScreen` is a separate screen. It will be implemented soon
---
 .../CalculatorContainer/CorrectionButton.vue      | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/components/CalculatorContainer/CorrectionButton.vue b/src/components/CalculatorContainer/CorrectionButton.vue
index 9cad37f..34aae55 100644
--- a/src/components/CalculatorContainer/CorrectionButton.vue
+++ b/src/components/CalculatorContainer/CorrectionButton.vue
@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { computed } from "vue"
 import type { Corrections } from "@/types/buttons"
 
 interface Props {
@@ -7,17 +8,23 @@ interface Props {
 const props = defineProps<Props>()
 
 interface CustomEvents {
-	(event: "appendToScreen", valueToAppend: Corrections): void
+	(event: "clearOneDigit"): void
+	(event: "clearAllScreens"): void
+	(event: "clearEntryScreen"): void
 }
 const emit = defineEmits<CustomEvents>()
+const mayOneDigitOnly = computed(() => props.value === "")
+const mayClearEntryScreenOnly = computed(() => props.value === "CE")
 
-function appendToScreen() {
-	emit("appendToScreen", props.value)
+function clearScreens() {
+	if (mayClearEntryScreenOnly.value) emit("clearEntryScreen")
+	if (mayOneDigitOnly.value) emit("clearOneDigit")
+	else emit("clearAllScreens")
 }
 </script>
 
 <template>
-	<button class="correction-button" @click="appendToScreen">
+	<button class="correction-button" @click="clearScreens">
 		{{ props.value }}
 	</button>
 </template>