Skip to content

Commit

Permalink
history LocalStorage
Browse files Browse the repository at this point in the history
  • Loading branch information
rez1dent3 committed Jul 27, 2024
1 parent ed9d811 commit 92fa1dd
Show file tree
Hide file tree
Showing 6 changed files with 38 additions and 6 deletions.
2 changes: 1 addition & 1 deletion .github/workflows/compile-assets.yml
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ jobs:
ui:
permissions:
contents: write
uses: bavix/.github/.github/workflows/[email protected].0
uses: bavix/.github/.github/workflows/[email protected].2
secrets: inherit
with:
nodejs: 21.x
2 changes: 1 addition & 1 deletion public/index.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion public/index.js.map

Large diffs are not rendered by default.

32 changes: 31 additions & 1 deletion src/app.jsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React from 'react'
import InputComponent from "./input.jsx"
import InputComponent, {Item} from "./input.jsx"
import HistoryComponent from "./history.jsx"
import NavComponent from './nav.jsx'
import '@creativebulma/bulma-tooltip/dist/bulma-tooltip.css'
Expand Down Expand Up @@ -29,6 +29,36 @@ export default class AppComponent extends React.Component {
super(props);
}

/**
* ComponentDidMount lifecycle hook.
* It gets the items from localStorage and sets the state.
*/
componentDidMount() {
const itemsFromLocalStorage = JSON.parse(localStorage.getItem('uuidItems')) || [];

let newItem
const items = {}
for (const item of itemsFromLocalStorage) {
newItem = new Item(item.input, item.output, item.info)
items[newItem.toString()] = newItem
}

this.setState({ items: Object.values(items) });
}

/**
* ComponentDidUpdate lifecycle hook.
* It saves the items to localStorage when the state changes.
* @param {Object} prevProps - The previous props.
* @param {Object} prevState - The previous state.
*/
componentDidUpdate(prevProps, prevState) {
let newState = [...this.state.items].slice(0, 100)
if (prevState.items !== newState) {
localStorage.setItem('uuidItems', JSON.stringify(newState));
}
}

/**
* Render method for the AppComponent.
*
Expand Down
4 changes: 3 additions & 1 deletion src/history.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,9 @@ export default class HistoryComponent extends React.Component {
{/* Field containing two tags */}
<div className="field">
{/* Output tag */}
<a href="javascript:" onClick={this.copy} className="tag is-link is-light" data-tooltip={i.info}>{ i.output }</a>
<div className="tags">
<a href="javascript:" onClick={this.copy} className="tag is-link is-light" data-tooltip={i.info}>{ i.output }</a>
</div>
{/* Input tag */}
<div className="tags">
<a href="javascript:" onClick={this.copy} className="tag is-primary is-light" data-tooltip={i.info}>{ i.input }</a>
Expand Down
2 changes: 1 addition & 1 deletion src/input.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ export function intTypeList() {
* Represents an item with input, output, and additional information.
* @class
*/
class Item {
export class Item {
/**
* Creates a new Item.
* @constructor
Expand Down

0 comments on commit 92fa1dd

Please sign in to comment.