Useful snippets

Ivareta git historikk ved file renaming

Sun 22. October 2023 | 2023-10-22

Ifølge https://koukia.ca/rename-or-move-files-in-git-e7259bf5a0b7

Hvis du vil være sikker på at file history blir ivaretatt i en fil om du renamer den (eller flytter den), så må du bruke commando-linja og kjøre

git mv mycoolclass.cs myCoolClass.cs

eller

git mv layout/CardList common/List

Hvis du renamer direkte i editor-en, så kan du ikke være sikker på at git skjønner at det er samme fil.

Når du ivaretar git history så kan du bruke ting som git log -p --follow -- path/to/filename. Se gist: https://gist.github.com/paalss/7127b421ff7f3a862ae8d76c772aeb6a

Kommentarer:

Mulig det er unødvendig å bruke mv. Da jeg renamet og flyttet layout/CardList til common/List så skjønte git at disse to filene var 74% like.

git log -p --follow components/common/List/List.tsx funker fjell. Historikken strekker seg tilbake til før renamingen

fordeler/ulemper med VSCode/Webstorm/Neovim

Sun 22. October 2023 | 2023-10-22

VS Code cons

  • den raskeste måten å cycle through hver changed file er å klikke på hver fil i source control panel. Ingen mulighet for å navigere gjennom med piltastene.
  • man må ofte reloade window på vscode når man avinstallerer/deaktiverer en plugin
  • kan ikke stole på statuslinjen, at den alltid viser riktig branch
  • Open recent-funksjonaliteten er litt brukken
    • hvis man prøver å åpne recent project-fuzzy-finderen umiddelbart etter at man har åpnet vscode, så vil den først åpnes, og så lukkes automatisk. Man kan jobbe rundt dette ved å åpne den ved å trykke og holde ctrl mens man trykker R, da
  • Vscodes git integrasjone er ikke så bra
    • git commit
      • kan bare skrive heading på commit messages
      • kan ikke begynne på commit message øyeblikkelig etter at man har addet med vscodes git add knapp / snarvei
    • git add
      • funker ikke for å markere solved merge conflicts, for en eller annen grunn
  • live evaluering, (linting/suggestions) tar tid
    • TS bruker tid på å slå inn
    • unused variables (eslint?) bruker også tid...
    • code suggestions/completions bruker også litt tid...
  • feilaktig linting
    • noen ganger så tror TS/eslint eller noe at noen packages ikke er installert. Når de virkelig ER det. Man må restarte VSCode for å se effekten
  • reload window forårsaker noen ganger at kommandolinjen hopper til det andre prosjektet du har åpent. F.eks. om du driver og jobber i med et bibliotek-prosjekt og et app-prosjekt, og må reloade vscode vinduet for appen, så kan kommandolinjen finne på å cd-e til biblioteket. Sykt!
  • hvis man prøver vim extension må man gi slipp på tastatursnarveier som
    • ctrl+pageUp/Down (noen ganger, ellers så funker det, bare at det er litt tregt. Kanskje forårsaket av vim extension, kanskje ikke)
    • close tabs (ctrl w) (!!! veldig irriterende)
    • noen ganger så føkker det opp angrefunksjonaliteten. jeg klikker på u og den bare sletter linjer under cursor WTF!
    • Man kan i hvert fall skru av og på vim (deactivated mode (oftest, noen ganger klikker den))

Kanskje du bør prøve webstorm

Webstorm

Pros

  • bedre git diff (bilde)
  • className får curly braces
  • kan lime inn filer fra windows explorer til webstorm explorer
  • leser classes i css og bringer auto-complete til jsx/html
  • automatisk sync mellom starting & ending tag

Cons:

  • hvordan lage tastatursnarvei for en enkelt bokstav?? (curly braces = shift alt 8)
  • uvant!

Neovim

Pros

  • kan bestemme selv hvordan lsp / code suggestion/completion skal funke
    • man kan bestemme at nedover-knappene ikke navigerer i listen, men flytter cursor nedover
  • vim motions funker alltid, i motsetning til vim addon i VS Code

Cons

  • MYE manuelt setup
  • man MÅ sette :set paste før man limer inn noe som helst fra annet steds
  • vanskelig å kopiere noe fra neovim til OS clipboard (er det i det hele tatt mulig?)
  • ekstremt vanskelig/umulig å bruke tastatursnarveier med ctrl og alt. For en eller annen grunn funker ikke ctrl+ø, men alt+ø funker. Men både ctrl og alt funker for "l". Kan gjøre noe magi med Autohotkey/autokey, men det er veldig plundrete
  • å få packages til å jobbe sammen
    • problem med merge conflict highlight packagen blir helt upåvirket av colorscheme. Det gjør at conflict marker får STYGGE farger. Man må eksplisitt sette :colorscheme tokyonight-night for å få colorscheme til å overskrive de stygge fargene igjen. Men hele pakken brekker når man åpner lazygit. Så ja.

i18next

Sun 22. October 2023 | 2023-10-22

Usage with long nested keys

const { t } = useTranslation("translation", {
  keyPrefix: "long.nested.keys",
});

HTML/JSX forskjell

Sun 22. October 2023 | 2023-10-22

  • class -> className
  • for -> htmlFor
  • how to set default value for <select>
  • onchange -> onBlur
  • <br>, <hr> -> <br/>, <hr/> (all elements must have closing tag / be self closing)

Delete all branches listed by `git branch -a`

Sun 22. October 2023 | 2023-10-22

Færre antall branches i code completion suggestion når du skriver git checkout feat-[Tab].

Slett alle branches som ikke finnes på remote:

git fetch -p (prune)

Use functions as children

Sun 22. October 2023 | 2023-10-22

Hvordan kan man lage et komponent som exposer en dataverdi som parent kan få tak i?

I.e. hvordan kan ChildComponent her gjøre dette lov?

          <ChildComponent>
            {({idFromChild}) => {
              return (
                <Button
                  href={`link/to/${idFromChild}`}
                >
					click here
                </Button>
              );
            }}
          </ChildComponent>

Slik:

export const ChildComponent = ({id}) => {
  return (
    <div>
      {children({
        id: id,
      })}
    </div>
  );
};

eleventy stuff

Sun 22. October 2023 | 2023-10-22

Eleventy stuff

eleventy.js

Return specific post

module.exports = function (eleventyConfig) {
  eleventyConfig.addPassthroughCopy("bundle.css");
  eleventyConfig.addPlugin(syntaxHighlight);
  eleventyConfig.addCollection("post", function (collection) {
    const coll = collection.getFilteredByTag("post");
    console.log(coll);
    return [coll[20]];
  });
};

Return first 5 posts

module.exports = function (eleventyConfig) {
  eleventyConfig.addPassthroughCopy("bundle.css");
  eleventyConfig.addPlugin(syntaxHighlight);
  eleventyConfig.addCollection("post", function (collection) {
    const coll = collection.getFilteredByTag("post");
    console.log(coll);
    return coll.slice(0, 5);
  });
};