Skip to content

Commit

Permalink
Merge pull request #101 from CityOfDetroit/cleanup.issue.1099
Browse files Browse the repository at this point in the history 
Fix card component lints & bug
  • Loading branch information
@jedgar1mx
jedgar1mx authored Oct 16, 2023
2 parents ad2d552 + ae8cef8 commit 72ba561
Showing 1 changed file with 37 additions and 90 deletions.
127 changes: 37 additions & 90 deletions src/components/organisms/Card/Card.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,102 +17,65 @@ export default class Card extends HTMLElement {
shadow.appendChild(template.content.cloneNode(true));
this.card = document.createElement('div');

// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line no-unused-vars
shadow.addEventListener('slotchange', (e) => {
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line prefer-const
let tempElements = Array.from(this.children);
shadow.addEventListener('slotchange', () => {
const tempElements = Array.from(this.children);
tempElements.forEach((node) => {
switch (node.tagName) {
case 'COD-CARD-HEADER':
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line no-case-declarations, prefer-const
let tempHeader = document.createElement('div');
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line no-case-declarations, prefer-const
let tempHeaderClasses = ['card-header'];
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line eqeqeq
node.getAttribute('data-extra-classes') != undefined &&
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line eqeqeq
node.getAttribute('data-extra-classes') != null
case 'COD-CARD-HEADER': {
const tempHeader = document.createElement('div');
const tempHeaderClasses = ['card-header'];
node.getAttribute('data-extra-classes') !== null &&
node.getAttribute('data-extra-classes') !== null
? tempHeaderClasses.push(node.getAttribute('data-extra-classes'))
: 0;
tempHeader.className = tempHeaderClasses.join(' ');
tempHeader.appendChild(node);
this.card.appendChild(tempHeader);
break;

case 'COD-CARD-BODY':
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line no-case-declarations, prefer-const
let tempBody = document.createElement('div');
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line no-case-declarations, prefer-const
let tempBodyClasses = ['card-body'];
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line eqeqeq
node.getAttribute('data-extra-classes') != undefined &&
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line eqeqeq
node.getAttribute('data-extra-classes') != null
? tempHeaderClasses.push(node.getAttribute('data-extra-classes'))
}
case 'COD-CARD-BODY': {
const tempBody = document.createElement('div');
const tempBodyClasses = ['card-body'];
node.getAttribute('data-extra-classes') !== null &&
node.getAttribute('data-extra-classes') !== null
? tempBodyClasses.push(node.getAttribute('data-extra-classes'))
: 0;
tempBody.className = tempBodyClasses.join(' ');
tempBody.appendChild(node);
this.card.appendChild(tempBody);
break;

case 'COD-CARD-FOOTER':
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line no-case-declarations, prefer-const
let tempFooter = document.createElement('div');
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line no-case-declarations, prefer-const
let tempFooterClasses = ['card-footer'];
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line eqeqeq
node.getAttribute('data-extra-classes') != undefined &&
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line eqeqeq
node.getAttribute('data-extra-classes') != null
}
case 'COD-CARD-FOOTER': {
const tempFooter = document.createElement('div');
const tempFooterClasses = ['card-footer'];
node.getAttribute('data-extra-classes') !== null &&
node.getAttribute('data-extra-classes') !== null
? tempFooterClasses.push(node.getAttribute('data-extra-classes'))
: 0;
tempFooter.className = tempFooterClasses.join(' ');
tempFooter.appendChild(node);
this.card.appendChild(tempFooter);
break;

case 'COD-CARD-OVERLAY':
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line no-case-declarations, prefer-const
let tempOverlay = document.createElement('div');
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line no-case-declarations, prefer-const
let tempOverlayClasses = ['card-img-overlay'];
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line eqeqeq
node.getAttribute('data-extra-classes') != undefined &&
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line eqeqeq
node.getAttribute('data-extra-classes') != null
}
case 'COD-CARD-OVERLAY': {
const tempOverlay = document.createElement('div');
const tempOverlayClasses = ['card-img-overlay'];
node.getAttribute('data-extra-classes') !== null &&
node.getAttribute('data-extra-classes') !== null
? tempOverlayClasses.push(node.getAttribute('data-extra-classes'))
: 0;
tempOverlay.className = tempOverlayClasses.join(' ');
tempOverlay.appendChild(node);
this.card.appendChild(tempOverlay);
break;

default:
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line no-case-declarations, prefer-const
let nodeClasses = node.className.split(' ');
}
default: {
const nodeClasses = node.className.split(' ');
nodeClasses.includes('no-wc')
? node.remove()
: this.card.appendChild(node);
break;
}
}
});
});
Expand All @@ -131,29 +94,13 @@ export default class Card extends HTMLElement {

connectedCallback() {
// Card attributes
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line prefer-const
let width = this.getAttribute('data-width');
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line prefer-const
let id = this.getAttribute('data-id');
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line prefer-const
let extraClasses = this.getAttribute('data-extra-classes');
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line prefer-const
let cardClasses = ['card'];
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line eqeqeq
extraClasses != undefined && extraClasses != null
? cardClasses.push(extraClasses)
: 0;
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line eqeqeq
width != undefined && width != null ? (this.card.style.width = width) : 0;
// TODO: See CityOfDetroit/detroitmi#1099
// eslint-disable-next-line eqeqeq
id != undefined && id != null ? (this.card.id = id) : 0;
const width = this.getAttribute('data-width');
const id = this.getAttribute('data-id');
const extraClasses = this.getAttribute('data-extra-classes');
const cardClasses = ['card'];
extraClasses !== null ? cardClasses.push(extraClasses) : 0;
width !== null ? (this.card.style.width = width) : 0;
id !== null ? (this.card.id = id) : 0;
this.card.className = cardClasses.join(' ');
if (!this.shadowRoot.querySelector('div')) {
this.shadowRoot.appendChild(this.card);
Expand Down

0 comments on commit 72ba561

Please sign in to comment.