[FE] - PHUONG BUI THANH (Michael - btphuong2017@gmail.com)

src/problem1/README.md

@@ -0,0 +1,16 @@
+# Problem 1 — Three ways to sum to n
+
+Three implementations of `sum_to_n(n)` using genuinely different strategies:
+
+| | Approach | Time | Space |
+|--|----------|------|-------|
+| A | Iterative `for` loop | O(n) | O(1) |
+| B | Gauss closed form `n*(n+1)/2` | **O(1)** | O(1) |
+| C | `Array.from + reduce` | O(n) | O(n) |
+
+Implementation B is the practical choice for any real code because it runs in constant
+time regardless of `n`. Implementation C trades memory for a more functional style that
+composes naturally with additional sequence transforms. All three return `0` for `n ≤ 0`
+(empty sum), which the problem leaves as an assumption since only positive examples are
+given.
+

src/problem1/index.ts

@@ -0,0 +1,23 @@
+// sum_to_n(n) returns 1 + 2 + ... + n.
+// For n <= 0 we return 0 (the prompt only illustrates positives; empty sum is the safe default).
+
+// Iterative — plain accumulation, easy to trace.
+var sum_to_n_a = function (n: number): number {
+  let total = 0;
+  for (let i = 1; i <= n; i++) {
+    total += i;
+  }
+  return total;
+};
+
+// Closed form — arithmetic series identity n*(n+1)/2, O(1).
+var sum_to_n_b = function (n: number): number {
+  if (n <= 0) return 0;
+  return (n * (n + 1)) / 2;
+};
+
+// Functional — build the sequence then fold; useful if you need to filter or map terms first.
+var sum_to_n_c = function (n: number): number {
+  if (n <= 0) return 0;
+  return Array.from({ length: n }, (_, i) => i + 1).reduce((acc, x) => acc + x, 0);
+};

src/problem1/request.md

@@ -0,0 +1,24 @@
+# Problem 1: Three ways to sum to n
+
+## Task
+
+Provide 3 unique implementations of the following function in JavaScript.
+
+**Input:** `n` — any integer
+Assuming this input will always produce a result lesser than `Number.MAX_SAFE_INTEGER`.
+
+**Output:** `return` — summation to n, i.e. `sum_to_n(5) === 1 + 2 + 3 + 4 + 5 === 15`.
+
+```js
+var sum_to_n_a = function(n) {
+    // your code here
+};
+
+var sum_to_n_b = function(n) {
+    // your code here
+};
+
+var sum_to_n_c = function(n) {
+    // your code here
+};
+```

src/problem2/.gitignore

@@ -0,0 +1,2 @@
+node_modules
+dist

src/problem2/README.md

@@ -0,0 +1,59 @@
+# Problem 2 — Fancy Form
+
+A currency swap form built with **Vite + React + TypeScript**.
+
+## Getting started
+
+```bash
+cd src/problem2
+npm install
+npm run dev
+```
+
+Then open the URL printed in the terminal (usually `http://localhost:5173`).
+
+To build for production:
+
+```bash
+npm run build
+npm run preview
+```
+
+## What it does
+
+- Fetches live token prices from `https://interview.switcheo.com/prices.json` on load.
+  Tokens without a price entry are omitted.
+- Pulls token icons from the Switcheo token-icon CDN (`*.svg`); broken images are
+  hidden gracefully with an `onError` handler.
+- Computes the receive amount in real time: `receiveAmount = sendAmount × (fromPrice / toPrice)`.
+- Validates the form inline: positive amount, both tokens selected, tokens must differ.
+- The **Confirm Swap** button simulates a backend call with a 1.5-second loading spinner,
+  then shows a success confirmation before resetting the form.
+
+## Running tests
+
+```bash
+npm test
+```
+
+Uses [Vitest](https://vitest.dev/) to test the pure logic in `src/lib/` (exchange-rate
+math and the price-feed deduplication/filtering).
+
+## Project layout
+
+```
+src/
+├── types.ts              Token and PriceRecord shapes
+├── lib/
+│   ├── prices.ts         Fetch + deduplicate prices; derive icon URLs
+│   └── format.ts         Exchange-rate math and number formatting
+├── hooks/
+│   └── usePrices.ts      Data-loading hook (loading / error / data)
+├── components/
+│   ├── TokenSelect.tsx   Searchable dropdown with icon + symbol
+│   └── SwapForm.tsx      Core form logic and layout
+├── App.tsx               Root component; wires usePrices → SwapForm
+├── App.css               Component-level styles
+├── index.css             Global reset and design tokens
+└── main.tsx              Vite entry point
+```

src/problem2/index.html

@@ -1,27 +1,12 @@
-<html>
-
-<head>
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>Fancy Form</title>
-
-  <!-- You may add more stuff here -->
-  <link href="style.css" rel="stylesheet" />
-</head>
-
-<body>
-
-  <!-- You may reorganise the whole HTML, as long as your form achieves the same effect. -->
-  <form onsubmit="return !1">
-    <h5>Swap</h5>
-    <label for="input-amount">Amount to send</label>
-    <input id="input-amount" />
-
-    <label for="output-amount">Amount to receive</label>
-    <input id="output-amount" />
-
-    <button>CONFIRM SWAP</button>
-  </form>
-  <script src="script.js"></script>
-</body>
-
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Fancy Form — Currency Swap</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
 </html>